+9 -6

apps/docs/src/components/alert-dialog/index.tsx

reviewed

··· 98 98 ); 99 99 }; 100 100 101 101 - export interface AlertDialogHeaderProps 102 102 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 101 101 + export interface AlertDialogHeaderProps extends StyleXComponentProps< 102 102 + React.ComponentProps<"div"> 103 103 + > {} 103 104 104 105 export const AlertDialogHeader = ({ 105 106 children, ··· 115 116 ); 116 117 }; 117 118 118 118 - export interface AlertDialogDescriptionProps 119 119 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 119 119 + export interface AlertDialogDescriptionProps extends StyleXComponentProps< 120 120 + React.ComponentProps<"div"> 121 121 + > {} 120 122 121 123 export const AlertDialogDescription = ({ 122 124 children, ··· 129 131 ); 130 132 }; 131 133 132 132 - export interface AlertDialogFooterProps 133 133 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 134 134 + export interface AlertDialogFooterProps extends StyleXComponentProps< 135 135 + React.ComponentProps<"div"> 136 136 + > {} 134 137 135 138 export const AlertDialogFooter = ({ 136 139 children,

+4 -2

apps/docs/src/components/alert/index.tsx

reviewed

··· 247 247 248 248 export type AlertVariant = "info" | "success" | "warning" | "critical"; 249 249 250 250 - export interface AlertProps 251 251 - extends Omit<StyleXComponentProps<React.ComponentProps<"div">>, "title"> { 250 250 + export interface AlertProps extends Omit< 251 251 + StyleXComponentProps<React.ComponentProps<"div">>, 252 252 + "title" 253 253 + > { 252 254 /** 253 255 * The variant of the alert. 254 256 * @default "info"

+6 -4

apps/docs/src/components/aspect-ratio/index.tsx

reviewed

··· 43 43 }, 44 44 }); 45 45 46 46 - export interface AspectRatioProps 47 47 - extends StyleXComponentProps<React.ComponentProps<"div">> { 46 46 + export interface AspectRatioProps extends StyleXComponentProps< 47 47 + React.ComponentProps<"div"> 48 48 + > { 48 49 aspectRatio?: number; 49 50 rounded?: boolean; 50 51 } ··· 68 69 ); 69 70 } 70 71 71 71 - export interface AspectRatioImageProps 72 72 - extends StyleXComponentProps<React.ComponentProps<"img">> {} 72 72 + export interface AspectRatioImageProps extends StyleXComponentProps< 73 73 + React.ComponentProps<"img"> 74 74 + > {} 73 75 74 76 export function AspectRatioImage({ style, ...props }: AspectRatioImageProps) { 75 77 return (

+3 -2

apps/docs/src/components/avatar/index.tsx

reviewed

··· 86 86 }, 87 87 }); 88 88 89 89 - export interface AvatarProps 90 90 - extends StyleXComponentProps<Omit<React.ComponentProps<"div">, "children">> { 89 89 + export interface AvatarProps extends StyleXComponentProps< 90 90 + Omit<React.ComponentProps<"div">, "children"> 91 91 + > { 91 92 /** The source of the image. */ 92 93 src?: string; 93 94 /** The alt text of the image. */

+3 -2

apps/docs/src/components/badge/index.tsx

reviewed

··· 68 68 }, 69 69 }); 70 70 71 71 - export interface BadgeProps 72 72 - extends StyleXComponentProps<React.ComponentProps<"div">> { 71 71 + export interface BadgeProps extends StyleXComponentProps< 72 72 + React.ComponentProps<"div"> 73 73 + > { 73 74 size?: Extract<Size, "sm" | "md">; 74 75 variant?: "primary" | "default" | "warning" | "critical" | "success"; 75 76 }

+6 -4

apps/docs/src/components/breadcrumbs/index.tsx

reviewed

··· 51 51 }, 52 52 }); 53 53 54 54 - export interface BreadcrumbsProps<T extends object = object> 55 55 - extends StyleXComponentProps<Omit<AriaBreadcrumbsProps<T>, "children">> { 54 54 + export interface BreadcrumbsProps< 55 55 + T extends object = object, 56 56 + > extends StyleXComponentProps<Omit<AriaBreadcrumbsProps<T>, "children">> { 56 57 isDisabled?: boolean; 57 58 children?: React.ReactNode; 58 59 } 59 60 60 60 - export interface BreadcrumbProps 61 61 - extends StyleXComponentProps<Omit<AriaBreadcrumbProps, "children">> { 61 61 + export interface BreadcrumbProps extends StyleXComponentProps< 62 62 + Omit<AriaBreadcrumbProps, "children"> 63 63 + > { 62 64 children?: React.ReactNode; 63 65 } 64 66

+2 -1

apps/docs/src/components/calendar/index.tsx

reviewed

··· 21 21 import { useCalendarStyles } from "../theme/useCalendarStyles"; 22 22 23 23 export interface CalendarProps<T extends DateValue> 24 24 - extends StyleXComponentProps<AriaCalendarProps<T>>, 24 24 + extends 25 25 + StyleXComponentProps<AriaCalendarProps<T>>, 25 26 Pick<CalendarGridProps, "weekdayStyle"> { 26 27 errorMessage?: string; 27 28 }

+24 -16

apps/docs/src/components/card/index.tsx

reviewed

··· 99 99 }, 100 100 }); 101 101 102 102 - export interface CardProps 103 103 - extends StyleXComponentProps<React.ComponentProps<"div">> { 102 102 + export interface CardProps extends StyleXComponentProps< 103 103 + React.ComponentProps<"div"> 104 104 + > { 104 105 size?: Size; 105 106 } 106 107 ··· 118 119 ); 119 120 }; 120 121 121 121 - export interface CardHeaderProps 122 122 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 122 122 + export interface CardHeaderProps extends StyleXComponentProps< 123 123 + React.ComponentProps<"div"> 124 124 + > {} 123 125 124 126 export const CardHeader = ({ style, ...props }: CardHeaderProps) => { 125 127 return ( ··· 130 132 ); 131 133 }; 132 134 133 133 - export interface CardTitleProps 134 134 - extends StyleXComponentProps<React.ComponentProps<"h2">> {} 135 135 + export interface CardTitleProps extends StyleXComponentProps< 136 136 + React.ComponentProps<"h2"> 137 137 + > {} 135 138 136 139 export const CardTitle = ({ style, ...props }: CardTitleProps) => { 137 140 return <div {...props} {...stylex.props(styles.cardTitle, style)} />; 138 141 }; 139 142 140 140 - export interface CardDescriptionProps 141 141 - extends StyleXComponentProps<React.ComponentProps<"p">> {} 143 143 + export interface CardDescriptionProps extends StyleXComponentProps< 144 144 + React.ComponentProps<"p"> 145 145 + > {} 142 146 143 147 export const CardDescription = ({ style, ...props }: CardDescriptionProps) => { 144 148 return ( ··· 150 154 ); 151 155 }; 152 156 153 153 - export interface CardHeaderActionProps 154 154 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 157 157 + export interface CardHeaderActionProps extends StyleXComponentProps< 158 158 + React.ComponentProps<"div"> 159 159 + > {} 155 160 156 161 export const CardHeaderAction = ({ 157 162 style, ··· 159 164 }: CardHeaderActionProps) => { 160 165 return <div {...props} {...stylex.props(styles.cardHeaderAction, style)} />; 161 166 }; 162 162 - export interface CardBodyProps 163 163 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 167 167 + export interface CardBodyProps extends StyleXComponentProps< 168 168 + React.ComponentProps<"div"> 169 169 + > {} 164 170 165 171 export const CardBody = ({ style, ...props }: CardBodyProps) => { 166 172 return ( ··· 171 177 ); 172 178 }; 173 179 174 174 - export interface CardFooterProps 175 175 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 180 180 + export interface CardFooterProps extends StyleXComponentProps< 181 181 + React.ComponentProps<"div"> 182 182 + > {} 176 183 177 184 export const CardFooter = ({ style, ...props }: CardFooterProps) => { 178 185 return ( ··· 183 190 ); 184 191 }; 185 192 186 186 - export interface CardImageProps 187 187 - extends StyleXComponentProps<React.ComponentProps<"img">> { 193 193 + export interface CardImageProps extends StyleXComponentProps< 194 194 + React.ComponentProps<"img"> 195 195 + > { 188 196 aspectRatio?: number; 189 197 } 190 198

+6 -4

apps/docs/src/components/checkbox/index.tsx

reviewed

··· 61 61 }, 62 62 }); 63 63 64 64 - interface CheckboxGroupProps 65 65 - extends StyleXComponentProps<Omit<AriaCheckboxGroupProps, "children">> { 64 64 + interface CheckboxGroupProps extends StyleXComponentProps< 65 65 + Omit<AriaCheckboxGroupProps, "children"> 66 66 + > { 66 67 children?: React.ReactNode; 67 68 label?: React.ReactNode; 68 69 description?: string; ··· 95 96 ); 96 97 } 97 98 98 98 - export interface CheckboxProps 99 99 - extends StyleXComponentProps<Omit<AriaCheckboxProps, "children">> { 99 99 + export interface CheckboxProps extends StyleXComponentProps< 100 100 + Omit<AriaCheckboxProps, "children"> 101 101 + > { 100 102 children?: React.ReactNode; 101 103 } 102 104

+3 -2

apps/docs/src/components/color-area/index.tsx

reviewed

··· 69 69 return <AriaColorThumb {...props} {...stylex.props(styles.thumb, style)} />; 70 70 } 71 71 72 72 - export interface ColorAreaProps 73 73 - extends StyleXComponentProps<Omit<AriaColorAreaProps, "children">> { 72 72 + export interface ColorAreaProps extends StyleXComponentProps< 73 73 + Omit<AriaColorAreaProps, "children"> 74 74 + > { 74 75 children?: React.ReactNode; 75 76 aspectRatio?: number; 76 77 }

+2 -1

apps/docs/src/components/color-field/index.tsx

reviewed

··· 85 85 } 86 86 87 87 export interface ColorFieldProps 88 88 - extends StyleXComponentProps<Omit<AriaColorFieldProps, "isInvalid">>, 88 88 + extends 89 89 + StyleXComponentProps<Omit<AriaColorFieldProps, "isInvalid">>, 89 90 Pick<InputProps, "placeholder"> { 90 91 label?: React.ReactNode; 91 92 description?: string;

+2 -1

apps/docs/src/components/color-picker/index.tsx

reviewed

··· 80 80 }); 81 81 82 82 export interface ColorPickerProps 83 83 - extends StyleXComponentProps<Omit<AriaColorPickerProps, "children">>, 83 83 + extends 84 84 + StyleXComponentProps<Omit<AriaColorPickerProps, "children">>, 84 85 Pick<PopoverProps, "placement"> { 85 86 children?: React.ReactNode; 86 87 size?: Size;

+3 -2

apps/docs/src/components/color-slider/index.tsx

reviewed

··· 68 68 }, 69 69 }); 70 70 71 71 - export interface ColorAreaProps 72 72 - extends StyleXComponentProps<Omit<AriaColorSliderProps, "children">> { 71 71 + export interface ColorAreaProps extends StyleXComponentProps< 72 72 + Omit<AriaColorSliderProps, "children"> 73 73 + > { 73 74 label?: string; 74 75 showValueLabel?: boolean; 75 76 size?: Size;

+6 -6

apps/docs/src/components/color-swatch-picker/index.tsx

reviewed

··· 56 56 }, 57 57 }); 58 58 59 59 - export interface ColorSwatchPickerProps 60 60 - extends StyleXComponentProps<Omit<AriaColorSwatchPickerProps, "children">> { 59 59 + export interface ColorSwatchPickerProps extends StyleXComponentProps< 60 60 + Omit<AriaColorSwatchPickerProps, "children"> 61 61 + > { 61 62 children?: React.ReactNode; 62 63 layout?: "grid" | "stack"; 63 64 size?: Size; ··· 86 87 ); 87 88 } 88 89 89 89 - export interface ColorSwatchPickerItemProps 90 90 - extends StyleXComponentProps< 91 91 - Omit<AriaColorSwatchPickerItemProps, "children"> 92 92 - > {} 90 90 + export interface ColorSwatchPickerItemProps extends StyleXComponentProps< 91 91 + Omit<AriaColorSwatchPickerItemProps, "children"> 92 92 + > {} 93 93 94 94 export function ColorSwatchPickerItem({ 95 95 style,

+3 -2

apps/docs/src/components/color-swatch/index.tsx

reviewed

··· 47 47 }, 48 48 }); 49 49 50 50 - export interface ColorSwatchProps 51 51 - extends StyleXComponentProps<Omit<AriaColorSwatchProps, "children">> { 50 50 + export interface ColorSwatchProps extends StyleXComponentProps< 51 51 + Omit<AriaColorSwatchProps, "children"> 52 52 + > { 52 53 children?: React.ReactNode; 53 54 size?: Size; 54 55 }

+3 -4

apps/docs/src/components/color-wheel/index.tsx

reviewed

··· 34 34 }, 35 35 }); 36 36 37 37 - export interface ColorWheelProps 38 38 - extends StyleXComponentProps< 39 39 - Omit<AriaColorWheelProps, "children" | "outerRadius" | "innerRadius"> 40 40 - > { 37 37 + export interface ColorWheelProps extends StyleXComponentProps< 38 38 + Omit<AriaColorWheelProps, "children" | "outerRadius" | "innerRadius"> 39 39 + > { 41 40 size?: Size; 42 41 width: number; 43 42 }

+2 -3

apps/docs/src/components/combobox/index.tsx

reviewed

··· 155 155 } 156 156 157 157 export interface ComboBoxProps<T extends object> 158 158 - extends StyleXComponentProps< 159 159 - Omit<AriaComboBoxProps<T>, "children" | "isInvalid"> 160 160 - >, 158 158 + extends 159 159 + StyleXComponentProps<Omit<AriaComboBoxProps<T>, "children" | "isInvalid">>, 161 160 Pick< 162 161 PopoverProps, 163 162 | "shouldCloseOnInteractOutside"

+2 -1

apps/docs/src/components/command-menu/index.tsx

reviewed

··· 40 40 }); 41 41 42 42 export interface CommandMenuProps<T extends object> 43 43 - extends OverlayTriggerProps, 43 43 + extends 44 44 + OverlayTriggerProps, 44 45 Pick<InputProps, "placeholder">, 45 46 AriaAutocompleteProps<T> { 46 47 children: React.ReactNode;

+2 -1

apps/docs/src/components/context-menu/index.tsx

reviewed

··· 137 137 } 138 138 139 139 export interface ContextMenuProps<T extends object> 140 140 - extends OverlayTriggerProps, 140 140 + extends 141 141 + OverlayTriggerProps, 141 142 StyleXComponentProps<Omit<AriaMenuProps<T>, "children">>, 142 143 Pick< 143 144 PopoverProps,

+3 -2

apps/docs/src/components/date-field/index.tsx

reviewed

··· 81 81 ); 82 82 } 83 83 84 84 - export interface DateFieldProps<T extends DateValue> 85 85 - extends StyleXComponentProps<Omit<AriaDateFieldProps<T>, "isInvalid">> { 84 84 + export interface DateFieldProps< 85 85 + T extends DateValue, 86 86 + > extends StyleXComponentProps<Omit<AriaDateFieldProps<T>, "isInvalid">> { 86 87 label?: React.ReactNode; 87 88 description?: string; 88 89 errorMessage?: string | ((validation: ValidationResult) => string);

+2 -1

apps/docs/src/components/date-picker/index.tsx

reviewed

··· 27 27 import { usePopoverStyles } from "../theme/usePopoverStyles"; 28 28 29 29 export interface DatePickerProps<T extends DateValue> 30 30 - extends StyleXComponentProps<Omit<AriaDatePickerProps<T>, "isInvalid">>, 30 30 + extends 31 31 + StyleXComponentProps<Omit<AriaDatePickerProps<T>, "isInvalid">>, 31 32 Pick<CalendarProps<T>, "weekdayStyle" | "visibleDuration"> { 32 33 label?: React.ReactNode; 33 34 description?: string;

+2 -1

apps/docs/src/components/date-range-picker/index.tsx

reviewed

··· 31 31 import { usePopoverStyles } from "../theme/usePopoverStyles"; 32 32 33 33 export interface DateRangePickerProps<T extends DateValue> 34 34 - extends StyleXComponentProps<Omit<AriaDateRangePickerProps<T>, "isInvalid">>, 34 34 + extends 35 35 + StyleXComponentProps<Omit<AriaDateRangePickerProps<T>, "isInvalid">>, 35 36 Pick<RangeCalendarProps<T>, "weekdayStyle" | "visibleDuration"> { 36 37 label?: React.ReactNode; 37 38 description?: string;

+12 -8

apps/docs/src/components/dialog/index.tsx

reviewed

··· 100 100 ); 101 101 }; 102 102 103 103 - export interface DialogHeaderProps 104 104 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 103 103 + export interface DialogHeaderProps extends StyleXComponentProps< 104 104 + React.ComponentProps<"div"> 105 105 + > {} 105 106 106 107 export const DialogHeader = ({ children, style }: DialogHeaderProps) => { 107 108 return ( ··· 114 115 ); 115 116 }; 116 117 117 117 - export interface DialogDescriptionProps 118 118 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 118 118 + export interface DialogDescriptionProps extends StyleXComponentProps< 119 119 + React.ComponentProps<"div"> 120 120 + > {} 119 121 120 122 export const DialogDescription = ({ 121 123 children, ··· 128 130 ); 129 131 }; 130 132 131 131 - export interface DialogBodyProps 132 132 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 133 133 + export interface DialogBodyProps extends StyleXComponentProps< 134 134 + React.ComponentProps<"div"> 135 135 + > {} 133 136 134 137 export const DialogBody = ({ children, style }: DialogBodyProps) => { 135 138 return <div {...stylex.props(styles.body, style)}>{children}</div>; 136 139 }; 137 140 138 138 - export interface DialogFooterProps 139 139 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 141 141 + export interface DialogFooterProps extends StyleXComponentProps< 142 142 + React.ComponentProps<"div"> 143 143 + > {} 140 144 141 145 export const DialogFooter = ({ children, style }: DialogFooterProps) => { 142 146 return <div {...stylex.props(styles.footer, style)}>{children}</div>;

+4 -4

apps/docs/src/components/disclosure-group/index.tsx

reviewed

··· 25 25 }, 26 26 }); 27 27 28 28 - export interface DisclosureGroupProps 29 29 - extends StyleXComponentProps<AriaDisclosureGroupProps> { 28 28 + export interface DisclosureGroupProps extends StyleXComponentProps<AriaDisclosureGroupProps> { 30 29 size?: Size; 31 30 } 32 31 ··· 48 47 ); 49 48 } 50 49 51 51 - export interface SeparatorProps 52 52 - extends StyleXComponentProps<React.HTMLAttributes<HTMLDivElement>> {} 50 50 + export interface SeparatorProps extends StyleXComponentProps< 51 51 + React.HTMLAttributes<HTMLDivElement> 52 52 + > {} 53 53 54 54 export function DisclosureGroupSeparator({ style, ...props }: SeparatorProps) { 55 55 return <div {...props} {...stylex.props(styles.separator, style)} />;

+9 -6

apps/docs/src/components/disclosure/index.tsx

reviewed

··· 103 103 }, 104 104 }); 105 105 106 106 - export interface DisclosureProps 107 107 - extends StyleXComponentProps<Omit<AriaDisclosureProps, "children">> { 106 106 + export interface DisclosureProps extends StyleXComponentProps< 107 107 + Omit<AriaDisclosureProps, "children"> 108 108 + > { 108 109 children: React.ReactNode; 109 110 size?: Size; 110 111 } ··· 128 129 ); 129 130 } 130 131 131 131 - export interface DisclosureTitleProps 132 132 - extends StyleXComponentProps<Omit<AriaButtonProps, "slot" | "children">> { 132 132 + export interface DisclosureTitleProps extends StyleXComponentProps< 133 133 + Omit<AriaButtonProps, "slot" | "children"> 134 134 + > { 133 135 children: React.ReactNode; 134 136 } 135 137 ··· 154 156 ); 155 157 } 156 158 157 157 - export interface DisclosurePanelProps 158 158 - extends StyleXComponentProps<Omit<AriaDisclosurePanelProps, "children">> { 159 159 + export interface DisclosurePanelProps extends StyleXComponentProps< 160 160 + Omit<AriaDisclosurePanelProps, "children"> 161 161 + > { 159 162 children: React.ReactNode; 160 163 isQuiet?: boolean; 161 164 }

+12 -8

apps/docs/src/components/drawer/index.tsx

reviewed

··· 208 208 ); 209 209 }; 210 210 211 211 - export interface DrawerHeaderProps 212 212 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 211 211 + export interface DrawerHeaderProps extends StyleXComponentProps< 212 212 + React.ComponentProps<"div"> 213 213 + > {} 213 214 214 215 export const DrawerHeader = ({ children, style }: DrawerHeaderProps) => { 215 216 return ( ··· 222 223 ); 223 224 }; 224 225 225 225 - export interface DrawerDescriptionProps 226 226 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 226 226 + export interface DrawerDescriptionProps extends StyleXComponentProps< 227 227 + React.ComponentProps<"div"> 228 228 + > {} 227 229 228 230 export const DrawerDescription = ({ 229 231 children, ··· 236 238 ); 237 239 }; 238 240 239 239 - export interface DrawerBodyProps 240 240 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 241 241 + export interface DrawerBodyProps extends StyleXComponentProps< 242 242 + React.ComponentProps<"div"> 243 243 + > {} 241 244 242 245 export const DrawerBody = ({ children, style }: DrawerBodyProps) => { 243 246 return <div {...stylex.props(styles.body, style)}>{children}</div>; 244 247 }; 245 248 246 246 - export interface DrawerFooterProps 247 247 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 249 249 + export interface DrawerFooterProps extends StyleXComponentProps< 250 250 + React.ComponentProps<"div"> 251 251 + > {} 248 252 249 253 export const DrawerFooter = ({ children, style }: DrawerFooterProps) => { 250 254 return <div {...stylex.props(styles.footer, style)}>{children}</div>;

+3 -4

apps/docs/src/components/editable-text/index.tsx

reviewed

··· 58 58 }, 59 59 }); 60 60 61 61 - export interface EditableTextProps 62 62 - extends StyleXComponentProps< 63 63 - Omit<React.ComponentProps<"span">, "children" | "onChange"> 64 64 - > { 61 61 + export interface EditableTextProps extends StyleXComponentProps< 62 62 + Omit<React.ComponentProps<"span">, "children" | "onChange"> 63 63 + > { 65 64 /** 66 65 * The current value of the editable text. 67 66 */

+15 -12

apps/docs/src/components/empty-state/index.tsx

reviewed

··· 112 112 }, 113 113 }); 114 114 115 115 - export interface EmptyStateProps 116 116 - extends StyleXComponentProps<React.ComponentProps<"div">> { 115 115 + export interface EmptyStateProps extends StyleXComponentProps< 116 116 + React.ComponentProps<"div"> 117 117 + > { 117 118 /** 118 119 * The size of the empty state component. 119 120 * @default "md" ··· 137 138 ); 138 139 }; 139 140 140 140 - export interface EmptyStateImageProps 141 141 - extends StyleXComponentProps< 142 142 - Omit<React.ComponentProps<"div">, "src" | "alt"> 143 143 - > { 141 141 + export interface EmptyStateImageProps extends StyleXComponentProps< 142 142 + Omit<React.ComponentProps<"div">, "src" | "alt"> 143 143 + > { 144 144 /** 145 145 * The source URL of the image. 146 146 * When provided, renders an img element instead of a div. ··· 171 171 ); 172 172 }; 173 173 174 174 - export interface EmptyStateTitleProps 175 175 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 174 174 + export interface EmptyStateTitleProps extends StyleXComponentProps< 175 175 + React.ComponentProps<"div"> 176 176 + > {} 176 177 177 178 export const EmptyStateTitle = ({ style, ...props }: EmptyStateTitleProps) => { 178 179 return <div {...props} {...stylex.props(styles.title, ui.text, style)} />; 179 180 }; 180 181 181 181 - export interface EmptyStateDescriptionProps 182 182 - extends StyleXComponentProps<React.ComponentProps<"p">> {} 182 182 + export interface EmptyStateDescriptionProps extends StyleXComponentProps< 183 183 + React.ComponentProps<"p"> 184 184 + > {} 183 185 184 186 export const EmptyStateDescription = ({ 185 187 style, ··· 190 192 ); 191 193 }; 192 194 193 193 - export interface EmptyStateActionsProps 194 194 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 195 195 + export interface EmptyStateActionsProps extends StyleXComponentProps< 196 196 + React.ComponentProps<"div"> 197 197 + > {} 195 198 196 199 export const EmptyStateActions = ({ 197 200 style,

+2 -1

apps/docs/src/components/file-drop-zone/index.tsx

reviewed

··· 52 52 }); 53 53 54 54 interface FileDropZoneProps 55 55 - extends Omit<AriaFileTriggerProps, "className" | "style">, 55 55 + extends 56 56 + Omit<AriaFileTriggerProps, "className" | "style">, 56 57 Pick<DropZoneProps, "isDisabled"> { 57 58 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 58 59 onAddFiles?: (files: File[]) => void;

+3 -2

apps/docs/src/components/flex/index.tsx

reviewed

··· 58 58 "gap-96": { gap: spacing["96"] }, 59 59 }); 60 60 61 61 - export interface FlexProps 62 62 - extends StyleXComponentProps<React.ComponentProps<"div">> { 61 61 + export interface FlexProps extends StyleXComponentProps< 62 62 + React.ComponentProps<"div"> 63 63 + > { 63 64 /** 64 65 * The direction of the flex container. 65 66 * @default "row"

+36 -24

apps/docs/src/components/footer/index.tsx

reviewed

··· 179 179 /** 180 180 * Footer root component. Main container for footer content. 181 181 */ 182 182 - export interface FooterRootProps 183 183 - extends StyleXComponentProps<React.ComponentProps<"footer">> { 182 182 + export interface FooterRootProps extends StyleXComponentProps< 183 183 + React.ComponentProps<"footer"> 184 184 + > { 184 185 /** 185 186 * Centers all footer content. 186 187 */ ··· 204 205 /** 205 206 * Footer logo component. Displays a logo in the footer. 206 207 */ 207 207 - export interface FooterLogoProps 208 208 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 208 208 + export interface FooterLogoProps extends StyleXComponentProps< 209 209 + React.ComponentProps<"div"> 210 210 + > {} 209 211 210 212 export const FooterLogo = ({ style, children, ...props }: FooterLogoProps) => { 211 213 return ( ··· 219 221 * Footer section component. Generic container for footer content with max-width, margin, and padding. 220 222 * Automatically adds a dim bottom border if it's not the last section. 221 223 */ 222 222 - export interface FooterSectionProps 223 223 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 224 224 + export interface FooterSectionProps extends StyleXComponentProps< 225 225 + React.ComponentProps<"div"> 226 226 + > {} 224 227 225 228 export const FooterSection = ({ style, ...props }: FooterSectionProps) => { 226 229 return <div {...props} {...stylex.props(styles.footerSection, style)} />; ··· 229 232 /** 230 233 * Footer navigation section component. Responsive grid container that displays 2 columns on smaller screens and 4 columns on larger screens. 231 234 */ 232 232 - export interface FooterNavSectionProps 233 233 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 235 235 + export interface FooterNavSectionProps extends StyleXComponentProps< 236 236 + React.ComponentProps<"div"> 237 237 + > {} 234 238 235 239 export const FooterNavSection = ({ 236 240 style, ··· 242 246 /** 243 247 * Footer navigation group component. Container for grouping related footer content. 244 248 */ 245 245 - export interface FooterNavGroupProps 246 246 - extends StyleXComponentProps<React.ComponentProps<"div">> { 249 249 + export interface FooterNavGroupProps extends StyleXComponentProps< 250 250 + React.ComponentProps<"div"> 251 251 + > { 247 252 /** 248 253 * Optional title for the group. 249 254 */ ··· 269 274 /** 270 275 * Footer copyright component. Displays copyright information. 271 276 */ 272 272 - export interface FooterCopyrightProps 273 273 - extends StyleXComponentProps<React.ComponentProps<"p">> {} 277 277 + export interface FooterCopyrightProps extends StyleXComponentProps< 278 278 + React.ComponentProps<"p"> 279 279 + > {} 274 280 275 281 export const FooterCopyright = ({ 276 282 style, ··· 287 293 /** 288 294 * Footer social link list component. Container for social media links. 289 295 */ 290 290 - export interface FooterSocialLinkListProps 291 291 - extends StyleXComponentProps<React.ComponentProps<"nav">> {} 296 296 + export interface FooterSocialLinkListProps extends StyleXComponentProps< 297 297 + React.ComponentProps<"nav"> 298 298 + > {} 292 299 293 300 export const FooterSocialLinkList = ({ 294 301 style, ··· 309 316 /** 310 317 * Footer social link item component. Individual social media link. 311 318 */ 312 312 - export interface FooterSocialLinkItemProps 313 313 - extends StyleXComponentProps<Omit<AriaLinkProps, "children">> { 319 319 + export interface FooterSocialLinkItemProps extends StyleXComponentProps< 320 320 + Omit<AriaLinkProps, "children"> 321 321 + > { 314 322 /** 315 323 * Icon to display in the link. Typically from lucide-react. 316 324 */ ··· 347 355 /** 348 356 * Footer subscribe component. Container for newsletter subscription section. 349 357 */ 350 350 - export interface FooterSubscribeProps 351 351 - extends StyleXComponentProps<React.ComponentProps<"div">> { 358 358 + export interface FooterSubscribeProps extends StyleXComponentProps< 359 359 + React.ComponentProps<"div"> 360 360 + > { 352 361 /** 353 362 * Layout variant. "horizontal" displays title/description on left and input on right. "vertical" stacks everything. 354 363 */ ··· 375 384 /** 376 385 * Footer subscribe title component. Displays the subscription section title. 377 386 */ 378 378 - export interface FooterSubscribeTitleProps 379 379 - extends StyleXComponentProps<React.ComponentProps<"h3">> {} 387 387 + export interface FooterSubscribeTitleProps extends StyleXComponentProps< 388 388 + React.ComponentProps<"h3"> 389 389 + > {} 380 390 381 391 export const FooterSubscribeTitle = ({ 382 392 style, ··· 393 403 /** 394 404 * Footer subscribe description component. Displays the subscription section description. 395 405 */ 396 396 - export interface FooterSubscribeDescriptionProps 397 397 - extends StyleXComponentProps<React.ComponentProps<"p">> {} 406 406 + export interface FooterSubscribeDescriptionProps extends StyleXComponentProps< 407 407 + React.ComponentProps<"p"> 408 408 + > {} 398 409 399 410 export const FooterSubscribeDescription = ({ 400 411 style, ··· 414 425 /** 415 426 * Footer subscribe input component. Contains an email input field and subscribe button. 416 427 */ 417 417 - export interface FooterSubscribeInputProps 418 418 - extends StyleXComponentProps<React.ComponentProps<"form">> { 428 428 + export interface FooterSubscribeInputProps extends StyleXComponentProps< 429 429 + React.ComponentProps<"form"> 430 430 + > { 419 431 /** 420 432 * Callback function called when the form is submitted. 421 433 */

+6 -4

apps/docs/src/components/grid/index.tsx

reviewed

··· 107 107 rowEnd: (end: number) => ({ gridRowEnd: end }), 108 108 }); 109 109 110 110 - export interface GridProps 111 111 - extends StyleXComponentProps<React.ComponentProps<"div">> { 110 110 + export interface GridProps extends StyleXComponentProps< 111 111 + React.ComponentProps<"div"> 112 112 + > { 112 113 /** 113 114 * The grid template rows of the grid container. 114 115 * @default "auto" ··· 226 227 ); 227 228 }; 228 229 229 229 - interface GridItemProps 230 230 - extends StyleXComponentProps<React.ComponentProps<"div">> { 230 230 + interface GridItemProps extends StyleXComponentProps< 231 231 + React.ComponentProps<"div"> 232 232 + > { 231 233 columnStart?: number; 232 234 columnEnd?: number; 233 235 rowStart?: number;

+15 -10

apps/docs/src/components/header-layout/index.tsx

reviewed

··· 83 83 /** 84 84 * Header layout root component. Main container for the page layout. 85 85 */ 86 86 - export interface HeaderLayoutRootProps 87 87 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 86 86 + export interface HeaderLayoutRootProps extends StyleXComponentProps< 87 87 + React.ComponentProps<"div"> 88 88 + > {} 88 89 89 90 export const HeaderLayoutRoot = ({ 90 91 style, ··· 96 97 /** 97 98 * Header layout header component. Slot for header content. 98 99 */ 99 99 - export interface HeaderLayoutHeaderProps 100 100 - extends StyleXComponentProps<React.ComponentProps<"header">> {} 100 100 + export interface HeaderLayoutHeaderProps extends StyleXComponentProps< 101 101 + React.ComponentProps<"header"> 102 102 + > {} 101 103 102 104 export const HeaderLayoutHeader = ({ 103 105 style, ··· 109 111 /** 110 112 * Header layout page component. Slot for main page content. 111 113 */ 112 112 - export interface HeaderLayoutPageProps 113 113 - extends StyleXComponentProps<React.ComponentProps<"main">> {} 114 114 + export interface HeaderLayoutPageProps extends StyleXComponentProps< 115 115 + React.ComponentProps<"main"> 116 116 + > {} 114 117 115 118 export const HeaderLayoutPage = ({ 116 119 style, ··· 122 125 /** 123 126 * Header layout footer component. Slot for footer content. 124 127 */ 125 125 - export interface HeaderLayoutFooterProps 126 126 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 128 128 + export interface HeaderLayoutFooterProps extends StyleXComponentProps< 129 129 + React.ComponentProps<"div"> 130 130 + > {} 127 131 128 132 export const HeaderLayoutFooter = ({ 129 133 style, ··· 136 140 * Header layout hero component. Full-width section with primary background color. 137 141 * Content follows the max-width constraint. 138 142 */ 139 139 - export interface HeaderLayoutHeroProps 140 140 - extends StyleXComponentProps<React.ComponentProps<"section">> {} 143 143 + export interface HeaderLayoutHeroProps extends StyleXComponentProps< 144 144 + React.ComponentProps<"section"> 145 145 + > {} 141 146 142 147 export const HeaderLayoutHero = ({ 143 148 style,

+4 -4

apps/docs/src/components/hover-card/index.tsx

reviewed

··· 31 31 }, 32 32 }); 33 33 34 34 - interface HoverCardInnerProps 35 35 - extends StyleXComponentProps<Omit<AriaPopoverProps, "trigger">> { 34 34 + interface HoverCardInnerProps extends StyleXComponentProps< 35 35 + Omit<AriaPopoverProps, "trigger"> 36 36 + > { 36 37 trigger: React.ComponentProps<typeof Pressable>["children"]; 37 38 triggerName?: AriaPopoverProps["trigger"]; 38 39 children: React.ReactNode; ··· 109 110 } 110 111 111 112 export interface HoverCardProps 112 112 - extends DialogTriggerProps, 113 113 - HoverCardInnerProps {} 113 113 + extends DialogTriggerProps, HoverCardInnerProps {} 114 114 115 115 export const HoverCard = ({ 116 116 defaultOpen,

+3 -2

apps/docs/src/components/kbd/index.tsx

reviewed

··· 28 28 }, 29 29 }); 30 30 31 31 - export interface KbdProps 32 32 - extends StyleXComponentProps<Omit<React.ComponentProps<"kbd">, "children">> { 31 31 + export interface KbdProps extends StyleXComponentProps< 32 32 + Omit<React.ComponentProps<"kbd">, "children"> 33 33 + > { 33 34 children: string; 34 35 } 35 36

+3 -2

apps/docs/src/components/label/index.tsx

reviewed

··· 120 120 ); 121 121 } 122 122 123 123 - export interface FieldErrorMessageProps 124 124 - extends StyleXComponentProps<Omit<FieldErrorProps, "children">> { 123 123 + export interface FieldErrorMessageProps extends StyleXComponentProps< 124 124 + Omit<FieldErrorProps, "children"> 125 125 + > { 125 126 children?: string | ((validation: ValidationResult) => string) | undefined; 126 127 } 127 128

+3 -2

apps/docs/src/components/link/index.tsx

reviewed

··· 55 55 }, 56 56 }); 57 57 58 58 - export interface LinkProps 59 59 - extends StyleXComponentProps<Omit<AriaLinkProps, "children">> { 58 58 + export interface LinkProps extends StyleXComponentProps< 59 59 + Omit<AriaLinkProps, "children"> 60 60 + > { 60 61 children: React.ReactNode; 61 62 } 62 63

+13 -10

apps/docs/src/components/listbox/index.tsx

reviewed

··· 56 56 57 57 const ListboxVariantContext = createContext<ListBoxVariant>("default"); 58 58 59 59 - export interface ListBoxProps<T extends object> 60 60 - extends StyleXComponentProps<AriaListBoxProps<T>> { 59 59 + export interface ListBoxProps<T extends object> extends StyleXComponentProps< 60 60 + AriaListBoxProps<T> 61 61 + > { 61 62 size?: Size; 62 63 items?: Iterable<T>; 63 64 children: React.ReactNode | ((item: T) => React.ReactNode); ··· 95 96 ); 96 97 } 97 98 98 98 - export interface ListBoxItemProps 99 99 - extends StyleXComponentProps<Omit<AriaListBoxItemProps, "children">> { 99 99 + export interface ListBoxItemProps extends StyleXComponentProps< 100 100 + Omit<AriaListBoxItemProps, "children"> 101 101 + > { 100 102 children: React.ReactNode; 101 103 prefix?: React.ReactNode; 102 104 suffix?: React.ReactNode; ··· 165 167 ); 166 168 } 167 169 168 168 - export interface ListBoxSectionProps<T extends object> 169 169 - extends StyleXComponentProps<AriaListBoxSectionProps<T>> { 170 170 + export interface ListBoxSectionProps< 171 171 + T extends object, 172 172 + > extends StyleXComponentProps<AriaListBoxSectionProps<T>> { 170 173 children: React.ReactNode; 171 174 } 172 175 ··· 177 180 return <AriaListBoxSection {...props} {...stylex.props(style)} />; 178 181 } 179 182 180 180 - export interface ListBoxSeparatorProps 181 181 - extends StyleXComponentProps<SeparatorProps> {} 183 183 + export interface ListBoxSeparatorProps extends StyleXComponentProps<SeparatorProps> {} 182 184 183 185 export function ListBoxSeparator({ style, ...props }: ListBoxSeparatorProps) { 184 186 return <Separator {...props} style={[styles.separator, style]} />; 185 187 } 186 188 187 187 - export interface ListBoxSectionHeaderProps 188 188 - extends StyleXComponentProps<React.HTMLAttributes<HTMLElement>> {} 189 189 + export interface ListBoxSectionHeaderProps extends StyleXComponentProps< 190 190 + React.HTMLAttributes<HTMLElement> 191 191 + > {} 189 192 190 193 export function ListBoxSectionHeader({ 191 194 style,

+10 -6

apps/docs/src/components/menu/index.tsx

reviewed

··· 44 44 }); 45 45 46 46 export interface MenuProps<T extends object> 47 47 - extends Omit<MenuTriggerProps, "trigger" | "children">, 47 47 + extends 48 48 + Omit<MenuTriggerProps, "trigger" | "children">, 48 49 Omit<AriaMenuProps<T>, "children" | "className" | "style">, 49 50 Pick< 50 51 PopoverProps, ··· 114 115 } 115 116 116 117 export interface SubMenuProps<T extends object> 117 117 - extends Omit<SubmenuTriggerProps, "trigger" | "children">, 118 118 + extends 119 119 + Omit<SubmenuTriggerProps, "trigger" | "children">, 118 120 Omit<AriaMenuProps<T>, "children" | "className" | "style">, 119 121 Pick< 120 122 PopoverProps, ··· 164 166 ); 165 167 } 166 168 167 167 - export interface MenuSectionProps<T extends object> 168 168 - extends StyleXComponentProps<AriaMenuSectionProps<T>> { 169 169 + export interface MenuSectionProps< 170 170 + T extends object, 171 171 + > extends StyleXComponentProps<AriaMenuSectionProps<T>> { 169 172 children: React.ReactNode; 170 173 } 171 174 ··· 176 179 return <AriaMenuSection {...props} {...stylex.props(style)} />; 177 180 } 178 181 179 179 - export interface MenuItemProps 180 180 - extends StyleXComponentProps<Omit<AriaMenuItemProps, "children">> { 182 182 + export interface MenuItemProps extends StyleXComponentProps< 183 183 + Omit<AriaMenuItemProps, "children"> 184 184 + > { 181 185 children: React.ReactNode; 182 186 prefix?: React.ReactNode; 183 187 suffix?: React.ReactNode;

+5 -3

apps/docs/src/components/menubar/index.tsx

reviewed

··· 85 85 }, 86 86 }); 87 87 88 88 - export interface MenubarProps 89 89 - extends StyleXComponentProps<React.ComponentProps<"div">> { 88 88 + export interface MenubarProps extends StyleXComponentProps< 89 89 + React.ComponentProps<"div"> 90 90 + > { 90 91 size?: Size; 91 92 value?: string; 92 93 defaultValue?: string; ··· 126 127 } 127 128 128 129 export interface MenubarItemProps 129 129 - extends StyleXComponentProps<React.ComponentProps<"div">>, 130 130 + extends 131 131 + StyleXComponentProps<React.ComponentProps<"div">>, 130 132 Pick<ButtonProps, "isDisabled"> { 131 133 label: string; 132 134 }

+12 -8

apps/docs/src/components/navbar/Navbar.tsx

reviewed

··· 217 217 }); 218 218 219 219 // Define subcomponents first so they can be referenced in Navbar 220 220 - export interface NavbarLogoProps 221 221 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 220 220 + export interface NavbarLogoProps extends StyleXComponentProps< 221 221 + React.ComponentProps<"div"> 222 222 + > {} 222 223 223 224 /** 224 225 * NavbarLogo component for displaying the logo in the navbar. ··· 231 232 ); 232 233 }; 233 234 234 234 - export interface NavbarNavigationProps 235 235 - extends StyleXComponentProps<React.ComponentProps<"div">> { 235 235 + export interface NavbarNavigationProps extends StyleXComponentProps< 236 236 + React.ComponentProps<"div"> 237 237 + > { 236 238 /** 237 239 * Justify content alignment for the navigation items. 238 240 * @default "left" ··· 265 267 ); 266 268 }; 267 269 268 268 - export interface NavbarActionProps 269 269 - extends StyleXComponentProps<React.ComponentProps<"div">> { 270 270 + export interface NavbarActionProps extends StyleXComponentProps< 271 271 + React.ComponentProps<"div"> 272 272 + > { 270 273 /** 271 274 * Whether the action should be always visible on mobile. 272 275 * @default false ··· 309 312 ); 310 313 } 311 314 312 312 - export interface NavbarProps 313 313 - extends StyleXComponentProps<React.ComponentProps<"div">> { 315 315 + export interface NavbarProps extends StyleXComponentProps< 316 316 + React.ComponentProps<"div"> 317 317 + > { 314 318 size?: Size; 315 319 } 316 320

+6 -4

apps/docs/src/components/navbar/NavbarMenu.tsx

reviewed

··· 180 180 ); 181 181 } 182 182 183 183 - export interface NavbarMenuTriggerProps 184 184 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 183 183 + export interface NavbarMenuTriggerProps extends StyleXComponentProps< 184 184 + React.ComponentProps<"div"> 185 185 + > {} 185 186 186 187 export function NavbarMenuTrigger({ style, ...props }: NavbarMenuTriggerProps) { 187 188 return <div {...props} {...stylex.props(styles.link, style)} />; 188 189 } 189 190 190 190 - interface NavbarMenuItemProps 191 191 - extends StyleXComponentProps<Omit<React.ComponentProps<"div">, "children">> { 191 191 + interface NavbarMenuItemProps extends StyleXComponentProps< 192 192 + Omit<React.ComponentProps<"div">, "children"> 193 193 + > { 192 194 icon?: React.ReactNode; 193 195 label: string; 194 196 description?: string;

+2 -3

apps/docs/src/components/number-field/index.tsx

reviewed

··· 197 197 } 198 198 199 199 export interface NumberFieldProps 200 200 - extends StyleXComponentProps< 201 201 - Omit<AriaNumberFieldProps, "children" | "isInvalid"> 202 202 - >, 200 200 + extends 201 201 + StyleXComponentProps<Omit<AriaNumberFieldProps, "children" | "isInvalid">>, 203 202 Pick<InputProps, "placeholder"> { 204 203 label?: React.ReactNode; 205 204 description?: string;

+3 -2

apps/docs/src/components/pagination/index.tsx

reviewed

··· 43 43 }, 44 44 }); 45 45 46 46 - export interface PaginationProps 47 47 - extends StyleXComponentProps<React.ComponentProps<"div">> { 46 46 + export interface PaginationProps extends StyleXComponentProps< 47 47 + React.ComponentProps<"div"> 48 48 + > { 48 49 defaultSelectedPage?: number; 49 50 selectedPage?: number; 50 51 onSelectedPageChange?: (page: number) => void;

+2 -1

apps/docs/src/components/popover/index.tsx

reviewed

··· 47 47 }, 48 48 }); 49 49 interface PopoverProps 50 50 - extends DialogTriggerProps, 50 50 + extends 51 51 + DialogTriggerProps, 51 52 StyleXComponentProps<Omit<AriaPopoverProps, "className" | "trigger">> { 52 53 trigger: React.ReactNode; 53 54 triggerName?: Pick<AriaPopoverProps, "trigger">;

+1 -2

apps/docs/src/components/progress-bar/index.tsx

reviewed

··· 98 98 }, 99 99 }); 100 100 101 101 - export interface ProgressBarProps 102 102 - extends StyleXComponentProps<AriaProgresBarProps> { 101 101 + export interface ProgressBarProps extends StyleXComponentProps<AriaProgresBarProps> { 103 102 label?: string; 104 103 showValueLabel?: boolean; 105 104 size?: Size;

+3 -2

apps/docs/src/components/progress-circle/index.tsx

reviewed

··· 108 108 }, 109 109 }); 110 110 111 111 - export interface ProgressCircleProps 112 112 - extends StyleXComponentProps<Omit<AriaProgressBarProps, "children">> { 111 111 + export interface ProgressCircleProps extends StyleXComponentProps< 112 112 + Omit<AriaProgressBarProps, "children"> 113 113 + > { 113 114 label?: string; 114 115 size?: Size; 115 116 }

+6 -4

apps/docs/src/components/radio/index.tsx

reviewed

··· 95 95 }, 96 96 }); 97 97 98 98 - interface RadioGroupProps 99 99 - extends StyleXComponentProps<Omit<AriaRadioGroupProps, "children">> { 98 98 + interface RadioGroupProps extends StyleXComponentProps< 99 99 + Omit<AriaRadioGroupProps, "children"> 100 100 + > { 100 101 children?: React.ReactNode; 101 102 label?: React.ReactNode; 102 103 description?: string; ··· 129 130 ); 130 131 } 131 132 132 132 - export interface RadioProps 133 133 - extends StyleXComponentProps<Omit<AriaRadioProps, "children">> { 133 133 + export interface RadioProps extends StyleXComponentProps< 134 134 + Omit<AriaRadioProps, "children"> 135 135 + > { 134 136 children?: React.ReactNode; 135 137 } 136 138

+2 -1

apps/docs/src/components/range-calendar/index.tsx

reviewed

··· 22 22 import { useCalendarStyles } from "../theme/useCalendarStyles"; 23 23 24 24 export interface RangeCalendarProps<T extends DateValue> 25 25 - extends StyleXComponentProps<AriaRangeCalendarProps<T>>, 25 25 + extends 26 26 + StyleXComponentProps<AriaRangeCalendarProps<T>>, 26 27 Pick<CalendarGridProps, "weekdayStyle"> { 27 28 errorMessage?: string; 28 29 }

+2 -1

apps/docs/src/components/search-field/index.tsx

reviewed

··· 115 115 } 116 116 117 117 export interface SearchFieldProps 118 118 - extends StyleXComponentProps<Omit<AriaSearchFieldProps, "isInvalid">>, 118 118 + extends 119 119 + StyleXComponentProps<Omit<AriaSearchFieldProps, "isInvalid">>, 119 120 Pick<InputProps, "placeholder"> { 120 121 label?: React.ReactNode; 121 122 description?: string;

+9 -9

apps/docs/src/components/segmented-control/index.tsx

reviewed

··· 101 101 }, 102 102 }); 103 103 104 104 - export interface SegmentedControlProps 105 105 - extends StyleXComponentProps< 106 106 - Omit< 107 107 - AriaToggleButtonGroupProps, 108 108 - "children" | "disallowEmptySelection" | "selectionMode" 109 109 - > 110 110 - > { 104 104 + export interface SegmentedControlProps extends StyleXComponentProps< 105 105 + Omit< 106 106 + AriaToggleButtonGroupProps, 107 107 + "children" | "disallowEmptySelection" | "selectionMode" 108 108 + > 109 109 + > { 111 110 children?: React.ReactNode; 112 111 size?: Size; 113 112 } ··· 133 132 ); 134 133 }; 135 134 136 136 - export interface SegmentedControlItemProps 137 137 - extends StyleXComponentProps<Omit<AriaToggleButtonProps, "children">> { 135 135 + export interface SegmentedControlItemProps extends StyleXComponentProps< 136 136 + Omit<AriaToggleButtonProps, "children"> 137 137 + > { 138 138 children?: React.ReactNode; 139 139 } 140 140

+2 -3

apps/docs/src/components/select/index.tsx

reviewed

··· 165 165 } 166 166 167 167 export interface SelectProps<T extends object, M extends "single" | "multiple"> 168 168 - extends StyleXComponentProps< 169 169 - Omit<AriaSelectProps<T, M>, "children" | "isInvalid"> 170 170 - >, 168 168 + extends 169 169 + StyleXComponentProps<Omit<AriaSelectProps<T, M>, "children" | "isInvalid">>, 171 170 Pick< 172 171 PopoverProps, 173 172 | "shouldCloseOnInteractOutside"

+1 -2

apps/docs/src/components/separator/index.tsx

reviewed

··· 23 23 }, 24 24 }); 25 25 26 26 - export interface SeparatorProps 27 27 - extends StyleXComponentProps<AriaSeparatorProps> {} 26 26 + export interface SeparatorProps extends StyleXComponentProps<AriaSeparatorProps> {} 28 27 29 28 export function Separator({ style, ...props }: SeparatorProps) { 30 29 return (

+9 -6

apps/docs/src/components/sidebar/index.tsx

reviewed

··· 147 147 }, 148 148 }); 149 149 150 150 - export interface SidebarProps 151 151 - extends StyleXComponentProps<React.ComponentProps<"div">> { 150 150 + export interface SidebarProps extends StyleXComponentProps< 151 151 + React.ComponentProps<"div"> 152 152 + > { 152 153 children: React.ReactNode; 153 154 } 154 155 ··· 181 182 ); 182 183 } 183 184 184 184 - export interface SidebarHeaderProps 185 185 - extends StyleXComponentProps<React.ComponentProps<"div">> { 185 185 + export interface SidebarHeaderProps extends StyleXComponentProps< 186 186 + React.ComponentProps<"div"> 187 187 + > { 186 188 children: React.ReactNode; 187 189 href?: string; 188 190 linkComponent?: React.ComponentType<React.ComponentProps<"a">>; ··· 277 279 ); 278 280 } 279 281 280 280 - export interface SidebarItemProps 281 281 - extends StyleXComponentProps<React.ComponentProps<"li">> { 282 282 + export interface SidebarItemProps extends StyleXComponentProps< 283 283 + React.ComponentProps<"li"> 284 284 + > { 282 285 children: React.ReactNode; 283 286 isActive?: boolean; 284 287 }

+6 -4

apps/docs/src/components/skeleton/index.tsx

reviewed

··· 79 79 }), 80 80 }); 81 81 82 82 - export interface SkeletonGroupProps 83 83 - extends StyleXComponentProps<React.ComponentProps<"div">> { 82 82 + export interface SkeletonGroupProps extends StyleXComponentProps< 83 83 + React.ComponentProps<"div"> 84 84 + > { 84 85 children: React.ReactNode; 85 86 } 86 87 ··· 98 99 99 100 export type SkeletonVariant = "circle" | "rectangle"; 100 101 101 101 - interface SkeletonBaseProps 102 102 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 102 102 + interface SkeletonBaseProps extends StyleXComponentProps< 103 103 + React.ComponentProps<"div"> 104 104 + > {} 103 105 104 106 interface SkeletonCircleProps extends SkeletonBaseProps { 105 107 variant: "circle";

+3 -2

apps/docs/src/components/switch/index.tsx

reviewed

··· 62 62 }, 63 63 }); 64 64 65 65 - interface SwitchBaseProps 66 66 - extends StyleXComponentProps<Omit<AriaSwitchProps, "children">> {} 65 65 + interface SwitchBaseProps extends StyleXComponentProps< 66 66 + Omit<AriaSwitchProps, "children"> 67 67 + > {} 67 68 68 69 interface SwitchWithChildrenProps extends SwitchBaseProps { 69 70 children: React.ReactNode;

+15 -10

apps/docs/src/components/table/index.tsx

reviewed

··· 194 194 return <SizeContext value={size}>{table}</SizeContext>; 195 195 }; 196 196 197 197 - export interface TableColumnProps 198 198 - extends StyleXComponentProps<Omit<AriaColumnProps, "children">> { 197 197 + export interface TableColumnProps extends StyleXComponentProps< 198 198 + Omit<AriaColumnProps, "children"> 199 199 + > { 199 200 children?: React.ReactNode; 200 201 hasResizer?: boolean; 201 202 hasEllipsis?: boolean; ··· 240 241 ); 241 242 } 242 243 243 243 - export interface TableHeaderProps<T extends object> 244 244 - extends StyleXComponentProps<AriaTableHeaderProps<T>> {} 244 244 + export interface TableHeaderProps< 245 245 + T extends object, 246 246 + > extends StyleXComponentProps<AriaTableHeaderProps<T>> {} 245 247 246 248 export function TableHeader<T extends object>({ 247 249 children, ··· 268 270 ); 269 271 } 270 272 271 271 - export interface TableRowProps<T extends object> 272 272 - extends StyleXComponentProps<AriaRowProps<T>> {} 273 273 + export interface TableRowProps<T extends object> extends StyleXComponentProps< 274 274 + AriaRowProps<T> 275 275 + > {} 273 276 274 277 export function TableRow<T extends object>({ 275 278 id, ··· 299 302 ); 300 303 } 301 304 302 302 - export interface TableBodyProps<T extends object> 303 303 - extends StyleXComponentProps<AriaTableBodyProps<T>> {} 305 305 + export interface TableBodyProps<T extends object> extends StyleXComponentProps< 306 306 + AriaTableBodyProps<T> 307 307 + > {} 304 308 305 309 export function TableBody<T extends object>({ 306 310 style, ··· 309 313 return <AriaTableBody {...prop} {...stylex.props(styles.tableBody, style)} />; 310 314 } 311 315 312 312 - export interface TableCellProps 313 313 - extends StyleXComponentProps<Omit<AriaCellProps, "children">> { 316 316 + export interface TableCellProps extends StyleXComponentProps< 317 317 + Omit<AriaCellProps, "children"> 318 318 + > { 314 319 children?: React.ReactNode; 315 320 hasEllipsis?: boolean; 316 321 }

+12 -8

apps/docs/src/components/tabs/index.tsx

reviewed

··· 183 183 }, 184 184 }); 185 185 186 186 - export interface TabsProps 187 187 - extends StyleXComponentProps<Omit<AriaTabsProps, "children">> { 186 186 + export interface TabsProps extends StyleXComponentProps< 187 187 + Omit<AriaTabsProps, "children"> 188 188 + > { 188 189 children: React.ReactNode; 189 190 size?: Size; 190 191 orientation?: "horizontal" | "vertical"; ··· 217 218 ); 218 219 } 219 220 220 220 - export interface TabListProps 221 221 - extends StyleXComponentProps<Omit<AriaTabListProps<object>, "children">> { 221 221 + export interface TabListProps extends StyleXComponentProps< 222 222 + Omit<AriaTabListProps<object>, "children"> 223 223 + > { 222 224 children: React.ReactNode; 223 225 } 224 226 ··· 230 232 ); 231 233 } 232 234 233 233 - export interface TabProps 234 234 - extends StyleXComponentProps<Omit<AriaTabProps, "children">> { 235 235 + export interface TabProps extends StyleXComponentProps< 236 236 + Omit<AriaTabProps, "children"> 237 237 + > { 235 238 children: React.ReactNode; 236 239 } 237 240 ··· 244 247 ); 245 248 } 246 249 247 247 - export interface TabPanelProps 248 248 - extends StyleXComponentProps<Omit<AriaTabPanelProps, "children">> { 250 250 + export interface TabPanelProps extends StyleXComponentProps< 251 251 + Omit<AriaTabPanelProps, "children"> 252 252 + > { 249 253 children: React.ReactNode; 250 254 } 251 255

+5 -3

apps/docs/src/components/tag-group/index.tsx

reviewed

··· 97 97 }); 98 98 99 99 interface TagGroupBaseProps<T> 100 100 - extends StyleXComponentProps<Omit<AriaTagGroupProps, "children">>, 100 100 + extends 101 101 + StyleXComponentProps<Omit<AriaTagGroupProps, "children">>, 101 102 Pick<TagListProps<T>, "items" | "children" | "renderEmptyState"> { 102 103 label?: string; 103 104 description?: string; ··· 132 133 ); 133 134 } 134 135 135 135 - export interface TagProps 136 136 - extends StyleXComponentProps<Omit<AriaTagProps, "children">> { 136 136 + export interface TagProps extends StyleXComponentProps< 137 137 + Omit<AriaTagProps, "children"> 138 138 + > { 137 139 children?: React.ReactNode; 138 140 } 139 141

+2 -1

apps/docs/src/components/text-area/index.tsx

reviewed

··· 122 122 }); 123 123 124 124 export interface TextAreaProps 125 125 - extends StyleXComponentProps<Omit<TextFieldProps, "children">>, 125 125 + extends 126 126 + StyleXComponentProps<Omit<TextFieldProps, "children">>, 126 127 Pick<AriaTextAreaProps, "rows">, 127 128 Pick<InputProps, "placeholder"> { 128 129 label?: React.ReactNode;

+2 -1

apps/docs/src/components/text-field/index.tsx

reviewed

··· 129 129 } 130 130 131 131 export interface TextFieldProps 132 132 - extends StyleXComponentProps<Omit<AriaTextFieldProps, "isInvalid">>, 132 132 + extends 133 133 + StyleXComponentProps<Omit<AriaTextFieldProps, "isInvalid">>, 133 134 Pick<InputProps, "placeholder"> { 134 135 label?: React.ReactNode; 135 136 description?: string;

+2 -1

apps/docs/src/components/theme/useCalendarStyles.ts

reviewed

··· 14 14 import { fontSize, fontWeight } from "./typography.stylex"; 15 15 16 16 export interface CalendarProps<T extends DateValue> 17 17 - extends StyleXComponentProps<AriaCalendarProps<T>>, 17 17 + extends 18 18 + StyleXComponentProps<AriaCalendarProps<T>>, 18 19 Pick<CalendarGridProps, "weekdayStyle"> { 19 20 errorMessage?: string; 20 21 }

+3 -2

apps/docs/src/components/time-field/index.tsx

reviewed

··· 81 81 ); 82 82 } 83 83 84 84 - export interface TimeFieldProps<T extends TimeValue> 85 85 - extends StyleXComponentProps<Omit<AriaTimeFieldProps<T>, "isInvalid">> { 84 84 + export interface TimeFieldProps< 85 85 + T extends TimeValue, 86 86 + > extends StyleXComponentProps<Omit<AriaTimeFieldProps<T>, "isInvalid">> { 86 87 label?: React.ReactNode; 87 88 description?: string; 88 89 errorMessage?: string | ((validation: ValidationResult) => string);

+3 -4

apps/docs/src/components/toast/Toast.tsx

reviewed

··· 163 163 ); 164 164 } 165 165 166 166 - export interface ToastRegionProps 167 167 - extends StyleXComponentProps< 168 168 - Omit<AriaToastRegionProps<ToastContentType>, "children" | "queue"> 169 169 - > {} 166 166 + export interface ToastRegionProps extends StyleXComponentProps< 167 167 + Omit<AriaToastRegionProps<ToastContentType>, "children" | "queue"> 168 168 + > {} 170 169 171 170 export function ToastRegion({ style, ...props }: ToastRegionProps) { 172 171 return (

+3 -2

apps/docs/src/components/toggle-button-group/index.tsx

reviewed

··· 50 50 }), 51 51 }); 52 52 53 53 - interface ToggleButtonGroupBaseProps 54 54 - extends StyleXComponentProps<Omit<AriaToggleButtonGroupProps, "children">> { 53 53 + interface ToggleButtonGroupBaseProps extends StyleXComponentProps< 54 54 + Omit<AriaToggleButtonGroupProps, "children"> 55 55 + > { 55 56 orientation?: "horizontal" | "vertical"; 56 57 children?: React.ReactNode; 57 58 }

+3 -2

apps/docs/src/components/toggle-button/index.tsx

reviewed

··· 91 91 }, 92 92 }); 93 93 94 94 - export interface ToggleButtonProps 95 95 - extends StyleXComponentProps<Omit<AriaToggleButtonProps, "children">> { 94 94 + export interface ToggleButtonProps extends StyleXComponentProps< 95 95 + Omit<AriaToggleButtonProps, "children"> 96 96 + > { 96 97 variant?: Exclude<ButtonVariant, "critical" | "critical-outline">; 97 98 size?: Size; 98 99 children?: React.ReactNode;

+3 -2

apps/docs/src/components/toolbar/index.tsx

reviewed

··· 90 90 return <Group {...props} {...stylex.props(styles.group, style)} />; 91 91 } 92 92 93 93 - export interface ToolbarSeparatorProps 94 94 - extends StyleXComponentProps<Omit<AriaSeparatorProps, "orientation">> {} 93 93 + export interface ToolbarSeparatorProps extends StyleXComponentProps< 94 94 + Omit<AriaSeparatorProps, "orientation"> 95 95 + > {} 95 96 96 97 export function ToolbarSeparator({ style, ...props }: ToolbarSeparatorProps) { 97 98 return (

+2 -1

apps/docs/src/components/tooltip/index.tsx

reviewed

··· 69 69 }); 70 70 71 71 interface TooltipProps 72 72 - extends TooltipTriggerComponentProps, 72 72 + extends 73 73 + TooltipTriggerComponentProps, 73 74 Pick<AriaTooltipProps, "crossOffset" | "placement" | "shouldFlip"> { 74 75 text: string; 75 76 children: React.ReactNode;

+9 -7

apps/docs/src/components/tree/index.tsx

reviewed

··· 103 103 }, 104 104 }); 105 105 106 106 - interface TreeItemContentProps 107 107 - extends Omit<AriaTreeItemContentProps, "children"> { 106 106 + interface TreeItemContentProps extends Omit< 107 107 + AriaTreeItemContentProps, 108 108 + "children" 109 109 + > { 108 110 children?: React.ReactNode; 109 111 prefix?: React.ReactNode; 110 112 suffix?: React.ReactNode; ··· 175 177 } 176 178 177 179 interface TreeItemBaseProps<T extends object> 178 178 - extends StyleXComponentProps< 179 179 - Omit<AriaTreeItemProps<T>, "textValue" | "children"> 180 180 - >, 180 180 + extends 181 181 + StyleXComponentProps<Omit<AriaTreeItemProps<T>, "textValue" | "children">>, 181 182 Pick<TreeItemContentProps, "prefix" | "suffix"> { 182 183 children?: React.ReactNode; 183 184 } ··· 226 227 ); 227 228 } 228 229 229 229 - export interface TreeProps<T extends object> 230 230 - extends StyleXComponentProps<Omit<AriaTreeProps<T>, "children">> { 230 230 + export interface TreeProps<T extends object> extends StyleXComponentProps< 231 231 + Omit<AriaTreeProps<T>, "children"> 232 232 + > { 231 233 children: React.ReactNode | ((item: T) => React.ReactNode); 232 234 size?: Size; 233 235 isVirtualized?: boolean;

+42 -28

apps/docs/src/components/typography/index.tsx

reviewed

··· 74 74 }, 75 75 }); 76 76 77 77 - export interface Heading1Props 78 78 - extends StyleXComponentProps<React.ComponentProps<"h1">> {} 77 77 + export interface Heading1Props extends StyleXComponentProps< 78 78 + React.ComponentProps<"h1"> 79 79 + > {} 79 80 80 81 export const Heading1 = ({ style, ...props }: Heading1Props) => { 81 82 // eslint-disable-next-line jsx-a11y/heading-has-content 82 83 return <h1 {...props} {...stylex.props(typeramp.heading1, style)} />; 83 84 }; 84 85 85 85 - export interface Heading2Props 86 86 - extends StyleXComponentProps<React.ComponentProps<"h2">> {} 86 86 + export interface Heading2Props extends StyleXComponentProps< 87 87 + React.ComponentProps<"h2"> 88 88 + > {} 87 89 88 90 export const Heading2 = ({ style, ...props }: Heading2Props) => { 89 91 // eslint-disable-next-line jsx-a11y/heading-has-content 90 92 return <h2 {...props} {...stylex.props(typeramp.heading2, style)} />; 91 93 }; 92 94 93 93 - export interface Heading3Props 94 94 - extends StyleXComponentProps<React.ComponentProps<"h3">> {} 95 95 + export interface Heading3Props extends StyleXComponentProps< 96 96 + React.ComponentProps<"h3"> 97 97 + > {} 95 98 96 99 export const Heading3 = ({ style, ...props }: Heading3Props) => { 97 100 // eslint-disable-next-line jsx-a11y/heading-has-content 98 101 return <h3 {...props} {...stylex.props(typeramp.heading3, style)} />; 99 102 }; 100 103 101 101 - export interface Heading4Props 102 102 - extends StyleXComponentProps<React.ComponentProps<"h4">> {} 104 104 + export interface Heading4Props extends StyleXComponentProps< 105 105 + React.ComponentProps<"h4"> 106 106 + > {} 103 107 104 108 export const Heading4 = ({ style, ...props }: Heading4Props) => { 105 109 // eslint-disable-next-line jsx-a11y/heading-has-content 106 110 return <h4 {...props} {...stylex.props(typeramp.heading4, style)} />; 107 111 }; 108 112 109 109 - export interface Heading5Props 110 110 - extends StyleXComponentProps<React.ComponentProps<"h5">> {} 113 113 + export interface Heading5Props extends StyleXComponentProps< 114 114 + React.ComponentProps<"h5"> 115 115 + > {} 111 116 112 117 export const Heading5 = ({ style, ...props }: Heading5Props) => { 113 118 // eslint-disable-next-line jsx-a11y/heading-has-content 114 119 return <h5 {...props} {...stylex.props(typeramp.heading5, style)} />; 115 120 }; 116 121 117 117 - export interface BodyProps 118 118 - extends StyleXComponentProps<React.ComponentProps<"p">> { 122 122 + export interface BodyProps extends StyleXComponentProps< 123 123 + React.ComponentProps<"p"> 124 124 + > { 119 125 variant?: TextVariant; 120 126 } 121 127 ··· 146 152 ); 147 153 }; 148 154 149 149 - export interface SmallBodyProps 150 150 - extends StyleXComponentProps<React.ComponentProps<"p">> { 155 155 + export interface SmallBodyProps extends StyleXComponentProps< 156 156 + React.ComponentProps<"p"> 157 157 + > { 151 158 variant?: TextVariant; 152 159 } 153 160 ··· 182 189 ); 183 190 }; 184 191 185 185 - interface LabelTextProps 186 186 - extends StyleXComponentProps<React.ComponentProps<"p">> { 192 192 + interface LabelTextProps extends StyleXComponentProps< 193 193 + React.ComponentProps<"p"> 194 194 + > { 187 195 variant?: TextVariant; 188 196 hasEllipsis?: boolean; 189 197 } ··· 208 216 ); 209 217 }; 210 218 211 211 - interface SubLabelProps 212 212 - extends StyleXComponentProps<React.ComponentProps<"p">> { 219 219 + interface SubLabelProps extends StyleXComponentProps< 220 220 + React.ComponentProps<"p"> 221 221 + > { 213 222 variant?: TextVariant; 214 223 } 215 224 ··· 244 253 ); 245 254 }; 246 255 247 247 - export interface BlockquoteProps 248 248 - extends StyleXComponentProps<React.ComponentProps<"blockquote">> {} 256 256 + export interface BlockquoteProps extends StyleXComponentProps< 257 257 + React.ComponentProps<"blockquote"> 258 258 + > {} 249 259 250 260 export const Blockquote = ({ style, ...props }: BlockquoteProps) => { 251 261 return <blockquote {...props} {...stylex.props(styles.blockquote, style)} />; 252 262 }; 253 263 254 254 - export interface UnorderedListProps 255 255 - extends StyleXComponentProps<React.ComponentProps<"ul">> {} 264 264 + export interface UnorderedListProps extends StyleXComponentProps< 265 265 + React.ComponentProps<"ul"> 266 266 + > {} 256 267 257 268 export const UnorderedList = ({ style, ...props }: UnorderedListProps) => { 258 269 return <ul {...props} {...stylex.props(styles.unorderedList, style)} />; 259 270 }; 260 271 261 261 - export interface OrderedListProps 262 262 - extends StyleXComponentProps<React.ComponentProps<"ol">> {} 272 272 + export interface OrderedListProps extends StyleXComponentProps< 273 273 + React.ComponentProps<"ol"> 274 274 + > {} 263 275 264 276 export const OrderedList = ({ style, ...props }: OrderedListProps) => { 265 277 return <ol {...props} {...stylex.props(styles.orderedList, style)} />; 266 278 }; 267 279 268 268 - export interface ListItemProps 269 269 - extends StyleXComponentProps<React.ComponentProps<"li">> {} 280 280 + export interface ListItemProps extends StyleXComponentProps< 281 281 + React.ComponentProps<"li"> 282 282 + > {} 270 283 271 284 export const ListItem = ({ style, children, ...props }: ListItemProps) => { 272 285 return ( ··· 276 289 ); 277 290 }; 278 291 279 279 - export interface InlineCodeProps 280 280 - extends StyleXComponentProps<React.ComponentProps<"code">> {} 292 292 + export interface InlineCodeProps extends StyleXComponentProps< 293 293 + React.ComponentProps<"code"> 294 294 + > {} 281 295 282 296 export const InlineCode = ({ style, ...props }: InlineCodeProps) => { 283 297 return (

+4 -2

apps/docs/src/components/typography/text.tsx

reviewed

··· 72 72 }, 73 73 }); 74 74 75 75 - interface TextProps 76 76 - extends Omit<React.ComponentProps<"span">, "style" | "className"> { 75 75 + interface TextProps extends Omit< 76 76 + React.ComponentProps<"span">, 77 77 + "style" | "className" 78 78 + > { 77 79 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 78 80 font?: ThemeKeys<typeof fontFamily>; 79 81 weight?: ThemeKeys<typeof fontWeight>;

+3 -6

apps/docs/src/components/window-splitter/index.tsx

reviewed

··· 57 57 }, 58 58 }); 59 59 60 60 - export interface WindowSplitterPanelGroupProps 61 61 - extends StyleXComponentProps<PanelGroupProps> {} 60 60 + export interface WindowSplitterPanelGroupProps extends StyleXComponentProps<PanelGroupProps> {} 62 61 63 63 - export interface WindowSplitterPanelProps 64 64 - extends StyleXComponentProps<PanelProps> {} 62 62 + export interface WindowSplitterPanelProps extends StyleXComponentProps<PanelProps> {} 65 63 66 66 - export interface WindowSplitterPanelResizerProps 67 67 - extends StyleXComponentProps<PanelResizerProps> {} 64 64 + export interface WindowSplitterPanelResizerProps extends StyleXComponentProps<PanelResizerProps> {} 68 65 69 66 export function PanelGroup({ style, ...props }: WindowSplitterPanelGroupProps) { 70 67 return <BasePanelGroup {...props} {...stylex.props(style)} />;

-1

apps/docs/src/examples/alert/basic.tsx

reviewed

··· 7 7 </Alert> 8 8 ); 9 9 } 10 10 -

+1 -6

apps/docs/src/examples/alert/custom-icon.tsx

reviewed

··· 3 3 4 4 export function CustomIcon() { 5 5 return ( 6 6 - <Alert 7 7 - variant="info" 8 8 - title="Custom Icon" 9 9 - icon={<Lightbulb />} 10 10 - > 6 6 + <Alert variant="info" title="Custom Icon" icon={<Lightbulb />}> 11 7 This alert uses a custom icon instead of the default icon. 12 8 </Alert> 13 9 ); 14 10 } 15 15 -

-1

apps/docs/src/examples/alert/dismissible.tsx

reviewed

··· 20 20 </Alert> 21 21 ); 22 22 } 23 23 -

-1

apps/docs/src/examples/alert/title-only-dismissible.tsx

reviewed

··· 27 27 </Flex> 28 28 ); 29 29 } 30 30 -

-1

apps/docs/src/examples/alert/title-only.tsx

reviewed

··· 11 11 </Flex> 12 12 ); 13 13 } 14 14 -

-1

apps/docs/src/examples/alert/variants.tsx

reviewed

··· 19 19 </Flex> 20 20 ); 21 21 } 22 22 -

+3 -1

apps/docs/src/examples/button/loading.tsx

reviewed

··· 5 5 return ( 6 6 <Flex gap="4" wrap> 7 7 <Button isLoading>Loading</Button> 8 8 - <Button variant="secondary" isLoading>Loading Secondary</Button> 8 8 + <Button variant="secondary" isLoading> 9 9 + Loading Secondary 10 10 + </Button> 9 11 </Flex> 10 12 ); 11 13 }

-2

apps/docs/src/examples/calendar/default.tsx

reviewed

··· 3 3 export function DefaultCalendar() { 4 4 return <Calendar aria-label="Appointment date" />; 5 5 } 6 6 - 7 7 -

-1

apps/docs/src/examples/color-field/validation-success.tsx

reviewed

··· 28 28 </Flex> 29 29 ); 30 30 } 31 31 -

-1

apps/docs/src/examples/color-field/validation-warning.tsx

reviewed

··· 28 28 </Flex> 29 29 ); 30 30 } 31 31 -

-1

apps/docs/src/examples/color-field/validation.tsx

reviewed

··· 28 28 </Flex> 29 29 ); 30 30 } 31 31 -

-1

apps/docs/src/examples/color-slider/size.tsx

reviewed

··· 33 33 </Flex> 34 34 ); 35 35 } 36 36 -

-1

apps/docs/src/examples/combobox/validation-success.tsx

reviewed

··· 37 37 </Flex> 38 38 ); 39 39 } 40 40 -

-1

apps/docs/src/examples/combobox/validation-warning.tsx

reviewed

··· 37 37 </Flex> 38 38 ); 39 39 } 40 40 -

-1

apps/docs/src/examples/combobox/validation.tsx

reviewed

··· 37 37 </Flex> 38 38 ); 39 39 } 40 40 -

-1

apps/docs/src/examples/date-field/validation-success.tsx

reviewed

··· 25 25 </Flex> 26 26 ); 27 27 } 28 28 -

-1

apps/docs/src/examples/date-field/validation-warning.tsx

reviewed

··· 25 25 </Flex> 26 26 ); 27 27 } 28 28 -

-1

apps/docs/src/examples/date-picker/validation-success.tsx

reviewed

··· 25 25 </Flex> 26 26 ); 27 27 } 28 28 -

-1

apps/docs/src/examples/date-picker/validation-warning.tsx

reviewed

··· 25 25 </Flex> 26 26 ); 27 27 } 28 28 -

-1

apps/docs/src/examples/date-picker/validation.tsx

reviewed

··· 25 25 </Flex> 26 26 ); 27 27 } 28 28 -

-1

apps/docs/src/examples/date-range-picker/basic.tsx

reviewed

··· 3 3 export function Basic() { 4 4 return <DateRangePicker label="Date Range" />; 5 5 } 6 6 -

-1

apps/docs/src/examples/date-range-picker/validation-success.tsx

reviewed

··· 25 25 </Flex> 26 26 ); 27 27 } 28 28 -

-1

apps/docs/src/examples/date-range-picker/validation-warning.tsx

reviewed

··· 25 25 </Flex> 26 26 ); 27 27 } 28 28 -

-1

apps/docs/src/examples/date-range-picker/validation.tsx

reviewed

··· 25 25 </Flex> 26 26 ); 27 27 } 28 28 -

-1

apps/docs/src/examples/disclosure-group/default-expanded.tsx

reviewed

··· 39 39 </DisclosureGroup> 40 40 ); 41 41 } 42 42 -

-1

apps/docs/src/examples/disclosure-group/multiple-expanded.tsx

reviewed

··· 44 44 </DisclosureGroup> 45 45 ); 46 46 } 47 47 -

+7 -4

apps/docs/src/examples/disclosure/disabled.tsx

reviewed

··· 1 1 - import { Disclosure, DisclosurePanel, DisclosureTitle } from "@/components/disclosure"; 1 1 + import { 2 2 + Disclosure, 3 3 + DisclosurePanel, 4 4 + DisclosureTitle, 5 5 + } from "@/components/disclosure"; 2 6 3 7 export function Disabled() { 4 8 return ( 5 9 <Disclosure> 6 10 <DisclosureTitle isDisabled>System Requirements</DisclosureTitle> 7 11 <DisclosurePanel> 8 8 - Details about system requirements here. 9 9 - Minimum system requirements include Windows 10 or macOS 10.15 or later. 12 12 + Details about system requirements here. Minimum system requirements 13 13 + include Windows 10 or macOS 10.15 or later. 10 14 </DisclosurePanel> 11 15 </Disclosure> 12 16 ); 13 17 } 14 14 -

+7 -4

apps/docs/src/examples/disclosure/expanded.tsx

reviewed

··· 1 1 - import { Disclosure, DisclosurePanel, DisclosureTitle } from "@/components/disclosure"; 1 1 + import { 2 2 + Disclosure, 3 3 + DisclosurePanel, 4 4 + DisclosureTitle, 5 5 + } from "@/components/disclosure"; 2 6 3 7 export function Expanded() { 4 8 return ( 5 9 <Disclosure defaultExpanded> 6 10 <DisclosureTitle>System Requirements</DisclosureTitle> 7 11 <DisclosurePanel> 8 8 - Details about system requirements here. 9 9 - Minimum system requirements include Windows 10 or macOS 10.15 or later. 12 12 + Details about system requirements here. Minimum system requirements 13 13 + include Windows 10 or macOS 10.15 or later. 10 14 </DisclosurePanel> 11 15 </Disclosure> 12 16 ); 13 17 } 14 14 -

-1

apps/docs/src/examples/drawer/form.tsx

reviewed

··· 26 26 </Drawer> 27 27 ); 28 28 } 29 29 -

+4 -11

apps/docs/src/examples/drawer/sizes.tsx

reviewed

··· 1 1 import { Button } from "@/components/button"; 2 2 - import { 3 3 - Drawer, 4 4 - DrawerHeader, 5 5 - DrawerBody, 6 6 - } from "@/components/drawer"; 2 2 + import { Drawer, DrawerHeader, DrawerBody } from "@/components/drawer"; 7 3 import { Flex } from "@/components/flex"; 8 4 import { Body } from "@/components/typography"; 9 5 ··· 20 16 <Drawer trigger={<Button>Medium Drawer</Button>} size="md"> 21 17 <DrawerHeader>Medium Drawer</DrawerHeader> 22 18 <DrawerBody> 23 23 - <Body> 24 24 - This is a medium drawer with more space for content. 25 25 - </Body> 19 19 + <Body>This is a medium drawer with more space for content.</Body> 26 20 </DrawerBody> 27 21 </Drawer> 28 22 ··· 30 24 <DrawerHeader>Large Drawer</DrawerHeader> 31 25 <DrawerBody> 32 26 <Body> 33 33 - This is a large drawer with even more space for content. 34 34 - Perfect for forms, detailed information, or complex layouts. 27 27 + This is a large drawer with even more space for content. Perfect for 28 28 + forms, detailed information, or complex layouts. 35 29 </Body> 36 30 </DrawerBody> 37 31 </Drawer> 38 32 </Flex> 39 33 ); 40 34 } 41 41 -

+6 -1

apps/docs/src/examples/header-layout/basic.tsx

reviewed

··· 1 1 import { HeaderLayout } from "@/components/header-layout"; 2 2 - import { Navbar, NavbarLogo, NavbarNavigation, NavbarLink } from "@/components/navbar"; 2 2 + import { 3 3 + Navbar, 4 4 + NavbarLogo, 5 5 + NavbarNavigation, 6 6 + NavbarLink, 7 7 + } from "@/components/navbar"; 3 8 4 9 function Logo() { 5 10 return (

+6 -2

apps/docs/src/examples/header-layout/with-footer.tsx

reviewed

··· 1 1 import { HeaderLayout } from "@/components/header-layout"; 2 2 - import { Navbar, NavbarLogo, NavbarNavigation, NavbarLink } from "@/components/navbar"; 2 2 + import { 3 3 + Navbar, 4 4 + NavbarLogo, 5 5 + NavbarNavigation, 6 6 + NavbarLink, 7 7 + } from "@/components/navbar"; 3 8 import { Footer } from "@/components/footer"; 4 9 5 10 function Logo() { ··· 47 52 </HeaderLayout.Root> 48 53 ); 49 54 } 50 50 -

-1

apps/docs/src/examples/menubar/size.tsx

reviewed

··· 49 49 </Flex> 50 50 ); 51 51 } 52 52 -

-1

apps/docs/src/examples/number-field/validation-success.tsx

reviewed

··· 34 34 </Flex> 35 35 ); 36 36 } 37 37 -

-1

apps/docs/src/examples/number-field/validation-warning.tsx

reviewed

··· 34 34 </Flex> 35 35 ); 36 36 } 37 37 -

-1

apps/docs/src/examples/number-field/validation.tsx

reviewed

··· 34 34 </Flex> 35 35 ); 36 36 } 37 37 -

-1

apps/docs/src/examples/progress-circle/indeterminate.tsx

reviewed

··· 17 17 </div> 18 18 ); 19 19 } 20 20 -

-1

apps/docs/src/examples/progress-circle/sizes.tsx

reviewed

··· 19 19 </div> 20 20 ); 21 21 } 22 22 -

-2

apps/docs/src/examples/range-calendar/default.tsx

reviewed

··· 3 3 export function DefaultRangeCalendar() { 4 4 return <RangeCalendar aria-label="Select a date range" />; 5 5 } 6 6 - 7 7 -

-2

apps/docs/src/examples/range-calendar/multiple-months.tsx

reviewed

··· 9 9 /> 10 10 ); 11 11 } 12 12 - 13 13 -

-1

apps/docs/src/examples/search-field/validation-success.tsx

reviewed

··· 28 28 </Flex> 29 29 ); 30 30 } 31 31 -

-1

apps/docs/src/examples/search-field/validation-warning.tsx

reviewed

··· 28 28 </Flex> 29 29 ); 30 30 } 31 31 -

-1

apps/docs/src/examples/search-field/validation.tsx

reviewed

··· 28 28 </Flex> 29 29 ); 30 30 } 31 31 -

-1

apps/docs/src/examples/segmented-control/basic.tsx

reviewed

··· 20 20 </SegmentedControl> 21 21 ); 22 22 } 23 23 -

-1

apps/docs/src/examples/segmented-control/size.tsx

reviewed

··· 44 44 </div> 45 45 ); 46 46 } 47 47 -

-1

apps/docs/src/examples/segmented-control/with-icons.tsx

reviewed

··· 30 30 </SegmentedControl> 31 31 ); 32 32 } 33 33 -

-1

apps/docs/src/examples/select/validation-success.tsx

reviewed

··· 37 37 </Flex> 38 38 ); 39 39 } 40 40 -

-1

apps/docs/src/examples/select/validation-warning.tsx

reviewed

··· 37 37 </Flex> 38 38 ); 39 39 } 40 40 -

+6 -2

apps/docs/src/examples/switch/with-description.tsx

reviewed

··· 6 6 <Flex direction="column" gap="4"> 7 7 <div> 8 8 <Switch>Enable notifications</Switch> 9 9 - <div style={{ fontSize: "0.875rem", color: "#666", marginTop: "0.25rem" }}> 9 9 + <div 10 10 + style={{ fontSize: "0.875rem", color: "#666", marginTop: "0.25rem" }} 11 11 + > 10 12 Receive email notifications about important updates 11 13 </div> 12 14 </div> 13 15 <div> 14 16 <Switch>Dark mode</Switch> 15 15 - <div style={{ fontSize: "0.875rem", color: "#666", marginTop: "0.25rem" }}> 17 17 + <div 18 18 + style={{ fontSize: "0.875rem", color: "#666", marginTop: "0.25rem" }} 19 19 + > 16 20 Switch to dark theme for better viewing in low light 17 21 </div> 18 22 </div>

-1

apps/docs/src/examples/tabs/basic.tsx

reviewed

··· 24 24 </Tabs> 25 25 ); 26 26 } 27 27 -

-1

apps/docs/src/examples/time-field/validation-success.tsx

reviewed

··· 25 25 </Flex> 26 26 ); 27 27 } 28 28 -

-1

apps/docs/src/examples/time-field/validation-warning.tsx

reviewed

··· 25 25 </Flex> 26 26 ); 27 27 } 28 28 -

-1

apps/docs/src/examples/time-field/validation.tsx

reviewed

··· 25 25 </Flex> 26 26 ); 27 27 } 28 28 -

+63 -63

apps/docs/src/routeTree.gen.ts

reviewed

··· 8 8 // You should NOT make any changes in this file as it will be overwritten. 9 9 // Additionally, you should also exclude this file from your linter and/or formatter to prevent it from being checked or modified. 10 10 11 11 - import { Route as rootRouteImport } from './routes/__root' 12 12 - import { Route as DocsRouteImport } from './routes/docs' 13 13 - import { Route as IndexRouteImport } from './routes/index' 14 14 - import { Route as DocsSplatRouteImport } from './routes/docs.$' 11 11 + import { Route as rootRouteImport } from "./routes/__root"; 12 12 + import { Route as DocsRouteImport } from "./routes/docs"; 13 13 + import { Route as IndexRouteImport } from "./routes/index"; 14 14 + import { Route as DocsSplatRouteImport } from "./routes/docs.$"; 15 15 16 16 const DocsRoute = DocsRouteImport.update({ 17 17 - id: '/docs', 18 18 - path: '/docs', 17 17 + id: "/docs", 18 18 + path: "/docs", 19 19 getParentRoute: () => rootRouteImport, 20 20 - } as any) 20 20 + } as any); 21 21 const IndexRoute = IndexRouteImport.update({ 22 22 - id: '/', 23 23 - path: '/', 22 22 + id: "/", 23 23 + path: "/", 24 24 getParentRoute: () => rootRouteImport, 25 25 - } as any) 25 25 + } as any); 26 26 const DocsSplatRoute = DocsSplatRouteImport.update({ 27 27 - id: '/$', 28 28 - path: '/$', 27 27 + id: "/$", 28 28 + path: "/$", 29 29 getParentRoute: () => DocsRoute, 30 30 - } as any) 30 30 + } as any); 31 31 32 32 export interface FileRoutesByFullPath { 33 33 - '/': typeof IndexRoute 34 34 - '/docs': typeof DocsRouteWithChildren 35 35 - '/docs/$': typeof DocsSplatRoute 33 33 + "/": typeof IndexRoute; 34 34 + "/docs": typeof DocsRouteWithChildren; 35 35 + "/docs/$": typeof DocsSplatRoute; 36 36 } 37 37 export interface FileRoutesByTo { 38 38 - '/': typeof IndexRoute 39 39 - '/docs': typeof DocsRouteWithChildren 40 40 - '/docs/$': typeof DocsSplatRoute 38 38 + "/": typeof IndexRoute; 39 39 + "/docs": typeof DocsRouteWithChildren; 40 40 + "/docs/$": typeof DocsSplatRoute; 41 41 } 42 42 export interface FileRoutesById { 43 43 - __root__: typeof rootRouteImport 44 44 - '/': typeof IndexRoute 45 45 - '/docs': typeof DocsRouteWithChildren 46 46 - '/docs/$': typeof DocsSplatRoute 43 43 + __root__: typeof rootRouteImport; 44 44 + "/": typeof IndexRoute; 45 45 + "/docs": typeof DocsRouteWithChildren; 46 46 + "/docs/$": typeof DocsSplatRoute; 47 47 } 48 48 export interface FileRouteTypes { 49 49 - fileRoutesByFullPath: FileRoutesByFullPath 50 50 - fullPaths: '/' | '/docs' | '/docs/$' 51 51 - fileRoutesByTo: FileRoutesByTo 52 52 - to: '/' | '/docs' | '/docs/$' 53 53 - id: '__root__' | '/' | '/docs' | '/docs/$' 54 54 - fileRoutesById: FileRoutesById 49 49 + fileRoutesByFullPath: FileRoutesByFullPath; 50 50 + fullPaths: "/" | "/docs" | "/docs/$"; 51 51 + fileRoutesByTo: FileRoutesByTo; 52 52 + to: "/" | "/docs" | "/docs/$"; 53 53 + id: "__root__" | "/" | "/docs" | "/docs/$"; 54 54 + fileRoutesById: FileRoutesById; 55 55 } 56 56 export interface RootRouteChildren { 57 57 - IndexRoute: typeof IndexRoute 58 58 - DocsRoute: typeof DocsRouteWithChildren 57 57 + IndexRoute: typeof IndexRoute; 58 58 + DocsRoute: typeof DocsRouteWithChildren; 59 59 } 60 60 61 61 - declare module '@tanstack/react-router' { 61 61 + declare module "@tanstack/react-router" { 62 62 interface FileRoutesByPath { 63 63 - '/docs': { 64 64 - id: '/docs' 65 65 - path: '/docs' 66 66 - fullPath: '/docs' 67 67 - preLoaderRoute: typeof DocsRouteImport 68 68 - parentRoute: typeof rootRouteImport 69 69 - } 70 70 - '/': { 71 71 - id: '/' 72 72 - path: '/' 73 73 - fullPath: '/' 74 74 - preLoaderRoute: typeof IndexRouteImport 75 75 - parentRoute: typeof rootRouteImport 76 76 - } 77 77 - '/docs/$': { 78 78 - id: '/docs/$' 79 79 - path: '/$' 80 80 - fullPath: '/docs/$' 81 81 - preLoaderRoute: typeof DocsSplatRouteImport 82 82 - parentRoute: typeof DocsRoute 83 83 - } 63 63 + "/docs": { 64 64 + id: "/docs"; 65 65 + path: "/docs"; 66 66 + fullPath: "/docs"; 67 67 + preLoaderRoute: typeof DocsRouteImport; 68 68 + parentRoute: typeof rootRouteImport; 69 69 + }; 70 70 + "/": { 71 71 + id: "/"; 72 72 + path: "/"; 73 73 + fullPath: "/"; 74 74 + preLoaderRoute: typeof IndexRouteImport; 75 75 + parentRoute: typeof rootRouteImport; 76 76 + }; 77 77 + "/docs/$": { 78 78 + id: "/docs/$"; 79 79 + path: "/$"; 80 80 + fullPath: "/docs/$"; 81 81 + preLoaderRoute: typeof DocsSplatRouteImport; 82 82 + parentRoute: typeof DocsRoute; 83 83 + }; 84 84 } 85 85 } 86 86 87 87 interface DocsRouteChildren { 88 88 - DocsSplatRoute: typeof DocsSplatRoute 88 88 + DocsSplatRoute: typeof DocsSplatRoute; 89 89 } 90 90 91 91 const DocsRouteChildren: DocsRouteChildren = { 92 92 DocsSplatRoute: DocsSplatRoute, 93 93 - } 93 93 + }; 94 94 95 95 - const DocsRouteWithChildren = DocsRoute._addFileChildren(DocsRouteChildren) 95 95 + const DocsRouteWithChildren = DocsRoute._addFileChildren(DocsRouteChildren); 96 96 97 97 const rootRouteChildren: RootRouteChildren = { 98 98 IndexRoute: IndexRoute, 99 99 DocsRoute: DocsRouteWithChildren, 100 100 - } 100 100 + }; 101 101 export const routeTree = rootRouteImport 102 102 ._addFileChildren(rootRouteChildren) 103 103 - ._addFileTypes<FileRouteTypes>() 103 103 + ._addFileTypes<FileRouteTypes>(); 104 104 105 105 - import type { getRouter } from './router.tsx' 106 106 - import type { createStart } from '@tanstack/react-start' 107 107 - declare module '@tanstack/react-start' { 105 105 + import type { getRouter } from "./router.tsx"; 106 106 + import type { createStart } from "@tanstack/react-start"; 107 107 + declare module "@tanstack/react-start" { 108 108 interface Register { 109 109 - ssr: true 110 110 - router: Awaited<ReturnType<typeof getRouter>> 109 109 + ssr: true; 110 110 + router: Awaited<ReturnType<typeof getRouter>>; 111 111 } 112 112 }

+4 -4

apps/docs/src/router.tsx

reviewed

··· 1 1 - import { createRouter } from '@tanstack/react-router' 1 1 + import { createRouter } from "@tanstack/react-router"; 2 2 3 3 // Import the generated route tree 4 4 - import { routeTree } from './routeTree.gen' 4 4 + import { routeTree } from "./routeTree.gen"; 5 5 6 6 // Create a new router instance 7 7 export const getRouter = () => { ··· 9 9 routeTree, 10 10 scrollRestoration: true, 11 11 defaultPreloadStaleTime: 0, 12 12 - }) 13 13 - } 12 12 + }); 13 13 + };

+12 -6

apps/example/src/components/alert-dialog/index.tsx

reviewed

··· 89 89 ); 90 90 }; 91 91 92 92 - export interface AlertDialogHeaderProps 93 93 - extends Omit<React.ComponentProps<"div">, "style" | "className"> { 92 92 + export interface AlertDialogHeaderProps extends Omit< 93 93 + React.ComponentProps<"div">, 94 94 + "style" | "className" 95 95 + > { 94 96 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 95 97 } 96 98 ··· 108 110 ); 109 111 }; 110 112 111 111 - export interface AlertDialogDescriptionProps 112 112 - extends Omit<React.ComponentProps<"div">, "style" | "className"> { 113 113 + export interface AlertDialogDescriptionProps extends Omit< 114 114 + React.ComponentProps<"div">, 115 115 + "style" | "className" 116 116 + > { 113 117 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 114 118 } 115 119 ··· 124 128 ); 125 129 }; 126 130 127 127 - export interface AlertDialogFooterProps 128 128 - extends Omit<React.ComponentProps<"div">, "style" | "className"> { 131 131 + export interface AlertDialogFooterProps extends Omit< 132 132 + React.ComponentProps<"div">, 133 133 + "style" | "className" 134 134 + > { 129 135 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 130 136 } 131 137

+4 -5

apps/example/src/components/avatar/index.tsx

reviewed

··· 70 70 }, 71 71 }); 72 72 73 73 - export interface AvatarProps 74 74 - extends Omit< 75 75 - React.ComponentProps<"div">, 76 76 - "style" | "className" | "children" 77 77 - > { 73 73 + export interface AvatarProps extends Omit< 74 74 + React.ComponentProps<"div">, 75 75 + "style" | "className" | "children" 76 76 + > { 78 77 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 79 78 src: string; 80 79 alt?: string;

+4 -2

apps/example/src/components/badge/index.tsx

reviewed

··· 42 42 }, 43 43 }); 44 44 45 45 - export interface BadgeProps 46 46 - extends Omit<React.ComponentProps<"div">, "style" | "className"> { 45 45 + export interface BadgeProps extends Omit< 46 46 + React.ComponentProps<"div">, 47 47 + "style" | "className" 48 48 + > { 47 49 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 48 50 size?: Extract<Size, "sm" | "md">; 49 51 variant?: "primary" | "default" | "warning" | "critical" | "success";

+5 -3

apps/example/src/components/button-group/index.tsx

reviewed

··· 18 18 }, 19 19 }); 20 20 21 21 - export interface ButtonGroupProps 22 22 - extends Omit<GroupProps, "className" | "style"> { 21 21 + export interface ButtonGroupProps extends Omit< 22 22 + GroupProps, 23 23 + "className" | "style" 24 24 + > { 23 25 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 24 26 orientation?: "horizontal" | "vertical"; 25 27 } ··· 37 39 styles.group, 38 40 orientation === "horizontal" && styles.horizontal, 39 41 orientation === "vertical" && styles.vertical, 40 40 - style 42 42 + style, 41 43 )} 42 44 {...props} 43 45 >

+4 -2

apps/example/src/components/button/index.tsx

reviewed

··· 9 9 import { useButtonStyles } from "../theme/useButtonStyles"; 10 10 import { Size, ButtonVariant } from "../types"; 11 11 12 12 - export interface ButtonProps 13 13 - extends Omit<AriaButtonProps, "className" | "style"> { 12 12 + export interface ButtonProps extends Omit< 13 13 + AriaButtonProps, 14 14 + "className" | "style" 15 15 + > { 14 16 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 15 17 variant?: ButtonVariant; 16 18 size?: Size;

+24 -12

apps/example/src/components/card/index.tsx

reviewed

··· 46 46 }, 47 47 }); 48 48 49 49 - export interface CardProps 50 50 - extends Omit<React.ComponentProps<"div">, "style" | "className"> { 49 49 + export interface CardProps extends Omit< 50 50 + React.ComponentProps<"div">, 51 51 + "style" | "className" 52 52 + > { 51 53 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 52 54 } 53 55 ··· 60 62 ); 61 63 }; 62 64 63 63 - export interface CardHeaderProps 64 64 - extends Omit<React.ComponentProps<"div">, "style" | "className"> { 65 65 + export interface CardHeaderProps extends Omit< 66 66 + React.ComponentProps<"div">, 67 67 + "style" | "className" 68 68 + > { 65 69 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 66 70 } 67 71 ··· 76 80 ); 77 81 }; 78 82 79 79 - export interface CardTitleProps 80 80 - extends Omit<React.ComponentProps<"h2">, "style" | "className"> { 83 83 + export interface CardTitleProps extends Omit< 84 84 + React.ComponentProps<"h2">, 85 85 + "style" | "className" 86 86 + > { 81 87 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 82 88 } 83 89 ··· 85 91 return <div {...props} {...stylex.props(styles.cardTitle, style)} />; 86 92 }; 87 93 88 88 - export interface CardDescriptionProps 89 89 - extends Omit<React.ComponentProps<"p">, "style" | "className"> { 94 94 + export interface CardDescriptionProps extends Omit< 95 95 + React.ComponentProps<"p">, 96 96 + "style" | "className" 97 97 + > { 90 98 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 91 99 } 92 100 ··· 99 107 ); 100 108 }; 101 109 102 102 - export interface CardBodyProps 103 103 - extends Omit<React.ComponentProps<"div">, "style" | "className"> { 110 110 + export interface CardBodyProps extends Omit< 111 111 + React.ComponentProps<"div">, 112 112 + "style" | "className" 113 113 + > { 104 114 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 105 115 } 106 116 ··· 108 118 return <div {...props} {...stylex.props(styles.cardBody, style)} />; 109 119 }; 110 120 111 111 - export interface CardFooterProps 112 112 - extends Omit<React.ComponentProps<"div">, "style" | "className"> { 121 121 + export interface CardFooterProps extends Omit< 122 122 + React.ComponentProps<"div">, 123 123 + "style" | "className" 124 124 + > { 113 125 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 114 126 } 115 127

+9 -5

apps/example/src/components/checkbox/index.tsx

reviewed

··· 54 54 }, 55 55 }); 56 56 57 57 - interface CheckboxGroupProps 58 58 - extends Omit<AriaCheckboxGroupProps, "children" | "style" | "className"> { 57 57 + interface CheckboxGroupProps extends Omit< 58 58 + AriaCheckboxGroupProps, 59 59 + "children" | "style" | "className" 60 60 + > { 59 61 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 60 62 children?: React.ReactNode; 61 63 label?: React.ReactNode; ··· 85 87 ); 86 88 } 87 89 88 88 - export interface CheckboxProps 89 89 - extends Omit<AriaCheckboxProps, "className" | "style" | "children"> { 90 90 + export interface CheckboxProps extends Omit< 91 91 + AriaCheckboxProps, 92 92 + "className" | "style" | "children" 93 93 + > { 90 94 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 91 95 children?: React.ReactNode; 92 96 } ··· 103 107 ? [gray.bgSolid, gray.border, styles.checked] 104 108 : isSelected 105 109 ? [primary.bgSolid, primary.borderInteractive, styles.checked] 106 106 - : [gray.borderInteractive] 110 110 + : [gray.borderInteractive], 107 111 )} 108 112 > 109 113 {isIndeterminate ? (

+2 -1

apps/example/src/components/color-field/index.tsx

reviewed

··· 14 14 import { Size } from "../types"; 15 15 16 16 export interface ColorFieldProps 17 17 - extends Omit<AriaColorFieldProps, "style" | "className">, 17 17 + extends 18 18 + Omit<AriaColorFieldProps, "style" | "className">, 18 19 Pick<InputProps, "placeholder"> { 19 20 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 20 21 label?: React.ReactNode;

+2 -1

apps/example/src/components/combobox/index.tsx

reviewed

··· 43 43 } 44 44 45 45 export interface ComboBoxProps<T extends object> 46 46 - extends Omit<AriaComboBoxProps<T>, "children" | "style" | "className">, 46 46 + extends 47 47 + Omit<AriaComboBoxProps<T>, "children" | "style" | "className">, 47 48 Pick< 48 49 PopoverProps, 49 50 | "shouldCloseOnInteractOutside"

+3 -2

apps/example/src/components/command-menu/index.tsx

reviewed

··· 40 40 }); 41 41 42 42 export interface CommandMenuProps<T extends object> 43 43 - extends OverlayTriggerProps, 43 43 + extends 44 44 + OverlayTriggerProps, 44 45 Pick<InputProps, "placeholder">, 45 46 AriaAutocompleteProps<T> { 46 47 children: React.ReactNode; ··· 66 67 const [isOpen, setIsOpen] = useControlledState( 67 68 isOpenProp, 68 69 defaultOpen ?? false, 69 69 - onOpenChange 70 70 + onOpenChange, 70 71 ); 71 72 const onClose = useEffectEvent(() => { 72 73 setIsOpen(false);

+2 -1

apps/example/src/components/context-menu/index.tsx

reviewed

··· 128 128 } 129 129 130 130 export interface ContextMenuProps<T extends object> 131 131 - extends OverlayTriggerProps, 131 131 + extends 132 132 + OverlayTriggerProps, 132 133 Omit<AriaMenuProps<T>, "children" | "className" | "style">, 133 134 Pick< 134 135 PopoverProps,

+4 -2

apps/example/src/components/date-field/index.tsx

reviewed

··· 14 14 import { useInputStyles } from "../theme/useInputStyles"; 15 15 import { Size } from "../types"; 16 16 17 17 - export interface DateFieldProps<T extends DateValue> 18 18 - extends Omit<AriaDateFieldProps<T>, "style" | "className"> { 17 17 + export interface DateFieldProps<T extends DateValue> extends Omit< 18 18 + AriaDateFieldProps<T>, 19 19 + "style" | "className" 20 20 + > { 19 21 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 20 22 label?: React.ReactNode; 21 23 description?: string;

+12 -6

apps/example/src/components/dialog/index.tsx

reviewed

··· 96 96 ); 97 97 }; 98 98 99 99 - export interface DialogHeaderProps 100 100 - extends Omit<React.ComponentProps<"div">, "style" | "className"> { 99 99 + export interface DialogHeaderProps extends Omit< 100 100 + React.ComponentProps<"div">, 101 101 + "style" | "className" 102 102 + > { 101 103 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 102 104 } 103 105 ··· 112 114 ); 113 115 }; 114 116 115 115 - export interface DialogDescriptionProps 116 116 - extends Omit<React.ComponentProps<"div">, "style" | "className"> { 117 117 + export interface DialogDescriptionProps extends Omit< 118 118 + React.ComponentProps<"div">, 119 119 + "style" | "className" 120 120 + > { 117 121 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 118 122 } 119 123 ··· 128 132 ); 129 133 }; 130 134 131 131 - export interface DialogFooterProps 132 132 - extends Omit<React.ComponentProps<"div">, "style" | "className"> { 135 135 + export interface DialogFooterProps extends Omit< 136 136 + React.ComponentProps<"div">, 137 137 + "style" | "className" 138 138 + > { 133 139 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 134 140 } 135 141

+5 -3

apps/example/src/components/flex copy/index.tsx

reviewed

··· 56 56 "gap-96": { gap: spacing["96"] }, 57 57 }); 58 58 59 59 - export interface FlexProps 60 60 - extends Omit<React.ComponentProps<"div">, "style" | "className"> { 59 59 + export interface FlexProps extends Omit< 60 60 + React.ComponentProps<"div">, 61 61 + "style" | "className" 62 62 + > { 61 63 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 62 64 /** 63 65 * The direction of the flex container. ··· 141 143 142 144 typeof gap === "string" && styles[`gap-${gap}` as keyof typeof styles], 143 145 144 144 - style 146 146 + style, 145 147 )} 146 148 /> 147 149 );

+4 -2

apps/example/src/components/flex/index.tsx

reviewed

··· 57 57 "gap-96": { gap: spacing["96"] }, 58 58 }); 59 59 60 60 - export interface FlexProps 61 61 - extends Omit<React.ComponentProps<"div">, "style" | "className"> { 60 60 + export interface FlexProps extends Omit< 61 61 + React.ComponentProps<"div">, 62 62 + "style" | "className" 63 63 + > { 62 64 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 63 65 /** 64 66 * The direction of the flex container.

+8 -4

apps/example/src/components/label/index.tsx

reviewed

··· 39 39 }, 40 40 }); 41 41 42 42 - export interface LabelProps 43 43 - extends Omit<AriaLabelProps, "style" | "className"> { 42 42 + export interface LabelProps extends Omit< 43 43 + AriaLabelProps, 44 44 + "style" | "className" 45 45 + > { 44 46 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 45 47 size?: Size; 46 48 } ··· 56 58 ); 57 59 } 58 60 59 59 - export interface DescriptionProps 60 60 - extends Omit<TextProps, "style" | "className"> { 61 61 + export interface DescriptionProps extends Omit< 62 62 + TextProps, 63 63 + "style" | "className" 64 64 + > { 61 65 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 62 66 size?: Size; 63 67 }

+20 -10

apps/example/src/components/listbox/index.tsx

reviewed

··· 48 48 }, 49 49 }); 50 50 51 51 - export interface ListBoxProps<T extends object> 52 52 - extends Omit<AriaListBoxProps<T>, "style" | "className"> { 51 51 + export interface ListBoxProps<T extends object> extends Omit< 52 52 + AriaListBoxProps<T>, 53 53 + "style" | "className" 54 54 + > { 53 55 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 54 56 size?: Size; 55 57 items?: Iterable<T>; ··· 70 72 ); 71 73 } 72 74 73 73 - export interface ListBoxItemProps 74 74 - extends Omit<AriaListBoxItemProps, "style" | "className" | "children"> { 75 75 + export interface ListBoxItemProps extends Omit< 76 76 + AriaListBoxItemProps, 77 77 + "style" | "className" | "children" 78 78 + > { 75 79 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 76 80 children: React.ReactNode; 77 81 prefix?: React.ReactNode; ··· 114 118 ); 115 119 } 116 120 117 117 - export interface ListBoxSectionProps<T extends object> 118 118 - extends Omit<AriaListBoxSectionProps<T>, "style" | "className"> { 121 121 + export interface ListBoxSectionProps<T extends object> extends Omit< 122 122 + AriaListBoxSectionProps<T>, 123 123 + "style" | "className" 124 124 + > { 119 125 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 120 126 children: React.ReactNode; 121 127 } ··· 127 133 return <AriaListBoxSection {...props} {...stylex.props(style)} />; 128 134 } 129 135 130 130 - export interface ListBoxSeparatorProps 131 131 - extends Omit<SeparatorProps, "style" | "className"> { 136 136 + export interface ListBoxSeparatorProps extends Omit< 137 137 + SeparatorProps, 138 138 + "style" | "className" 139 139 + > { 132 140 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 133 141 } 134 142 ··· 136 144 return <Separator {...props} style={[styles.separator, style]} />; 137 145 } 138 146 139 139 - export interface ListBoxSectionHeaderProps 140 140 - extends Omit<React.HTMLAttributes<HTMLElement>, "style" | "className"> { 147 147 + export interface ListBoxSectionHeaderProps extends Omit< 148 148 + React.HTMLAttributes<HTMLElement>, 149 149 + "style" | "className" 150 150 + > { 141 151 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 142 152 } 143 153

+12 -6

apps/example/src/components/menu/index.tsx

reviewed

··· 22 22 import { Size } from "../types"; 23 23 24 24 export interface MenuProps<T extends object> 25 25 - extends Omit<MenuTriggerProps, "trigger" | "children">, 25 25 + extends 26 26 + Omit<MenuTriggerProps, "trigger" | "children">, 26 27 Omit<AriaMenuProps<T>, "children" | "className" | "style">, 27 28 Pick< 28 29 PopoverProps, ··· 75 76 } 76 77 77 78 export interface SubMenuProps<T extends object> 78 78 - extends Omit<SubmenuTriggerProps, "trigger" | "children">, 79 79 + extends 80 80 + Omit<SubmenuTriggerProps, "trigger" | "children">, 79 81 Omit<AriaMenuProps<T>, "children" | "className" | "style">, 80 82 Pick< 81 83 PopoverProps, ··· 118 120 ); 119 121 } 120 122 121 121 - export interface MenuSectionProps<T extends object> 122 122 - extends Omit<AriaMenuSectionProps<T>, "style" | "className"> { 123 123 + export interface MenuSectionProps<T extends object> extends Omit< 124 124 + AriaMenuSectionProps<T>, 125 125 + "style" | "className" 126 126 + > { 123 127 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 124 128 children: React.ReactNode; 125 129 } ··· 131 135 return <AriaMenuSection {...props} {...stylex.props(style)} />; 132 136 } 133 137 134 134 - export interface MenuItemProps 135 135 - extends Omit<AriaMenuItemProps, "style" | "className" | "children"> { 138 138 + export interface MenuItemProps extends Omit< 139 139 + AriaMenuItemProps, 140 140 + "style" | "className" | "children" 141 141 + > { 136 142 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 137 143 children: React.ReactNode; 138 144 prefix?: React.ReactNode;

+2 -1

apps/example/src/components/number-field/index.tsx

reviewed

··· 52 52 }); 53 53 54 54 export interface NumberFieldProps 55 55 - extends Omit<AriaNumberFieldProps, "style" | "className">, 55 55 + extends 56 56 + Omit<AriaNumberFieldProps, "style" | "className">, 56 57 Pick<InputProps, "placeholder"> { 57 58 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 58 59 label?: React.ReactNode;

+2 -1

apps/example/src/components/popover/index.tsx

reviewed

··· 42 42 }, 43 43 }); 44 44 interface TooltipProps 45 45 - extends DialogTriggerProps, 45 45 + extends 46 46 + DialogTriggerProps, 46 47 Pick<AriaPopoverProps, "crossOffset" | "placement" | "shouldFlip"> { 47 48 trigger: React.ReactNode; 48 49 children: React.ReactNode;

+8 -4

apps/example/src/components/radio/index.tsx

reviewed

··· 84 84 }, 85 85 }); 86 86 87 87 - interface RadioGroupProps 88 88 - extends Omit<AriaRadioGroupProps, "children" | "style" | "className"> { 87 87 + interface RadioGroupProps extends Omit< 88 88 + AriaRadioGroupProps, 89 89 + "children" | "style" | "className" 90 90 + > { 89 91 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 90 92 children?: React.ReactNode; 91 93 label?: React.ReactNode; ··· 115 117 ); 116 118 } 117 119 118 118 - export interface RadioProps 119 119 - extends Omit<AriaRadioProps, "className" | "style" | "children"> { 120 120 + export interface RadioProps extends Omit< 121 121 + AriaRadioProps, 122 122 + "className" | "style" | "children" 123 123 + > { 120 124 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 121 125 children?: React.ReactNode; 122 126 }

+2 -1

apps/example/src/components/search-field/index.tsx

reviewed

··· 32 32 }); 33 33 34 34 export interface SearchFieldProps 35 35 - extends Omit<AriaSearchFieldProps, "style" | "className">, 35 35 + extends 36 36 + Omit<AriaSearchFieldProps, "style" | "className">, 36 37 Pick<InputProps, "placeholder"> { 37 38 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 38 39 label?: React.ReactNode;

+2 -1

apps/example/src/components/select/index.tsx

reviewed

··· 27 27 }); 28 28 29 29 export interface SelectProps<T extends object, M extends "single" | "multiple"> 30 30 - extends Omit<AriaSelectProps<T, M>, "children" | "style" | "className">, 30 30 + extends 31 31 + Omit<AriaSelectProps<T, M>, "children" | "style" | "className">, 31 32 Pick< 32 33 PopoverProps, 33 34 | "shouldCloseOnInteractOutside"

+4 -2

apps/example/src/components/separator/index.tsx

reviewed

··· 22 22 }, 23 23 }); 24 24 25 25 - export interface SeparatorProps 26 26 - extends Omit<AriaSeparatorProps, "style" | "className"> { 25 25 + export interface SeparatorProps extends Omit< 26 26 + AriaSeparatorProps, 27 27 + "style" | "className" 28 28 + > { 27 29 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 28 30 } 29 31

+2 -1

apps/example/src/components/text-area/index.tsx

reviewed

··· 112 112 }); 113 113 114 114 export interface TextAreaProps 115 115 - extends Omit<TextFieldProps, "style" | "className">, 115 115 + extends 116 116 + Omit<TextFieldProps, "style" | "className">, 116 117 Pick<AriaTextAreaProps, "rows">, 117 118 Pick<InputProps, "placeholder"> { 118 119 style?: stylex.StyleXStyles | stylex.StyleXStyles[];

+2 -1

apps/example/src/components/text-field/index.tsx

reviewed

··· 46 46 } 47 47 48 48 export interface TextFieldProps 49 49 - extends Omit<AriaTextFieldProps, "style" | "className">, 49 49 + extends 50 50 + Omit<AriaTextFieldProps, "style" | "className">, 50 51 Pick<InputProps, "placeholder"> { 51 52 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 52 53 label?: React.ReactNode;

+4 -2

apps/example/src/components/time-field/index.tsx

reviewed

··· 14 14 import { useInputStyles } from "../theme/useInputStyles"; 15 15 import { Size } from "../types"; 16 16 17 17 - export interface TimeFieldProps<T extends TimeValue> 18 18 - extends Omit<AriaTimeFieldProps<T>, "style" | "className"> { 17 17 + export interface TimeFieldProps<T extends TimeValue> extends Omit< 18 18 + AriaTimeFieldProps<T>, 19 19 + "style" | "className" 20 20 + > { 19 21 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 20 22 label?: React.ReactNode; 21 23 description?: string;

+4 -2

apps/example/src/components/toggle-button-group/index.tsx

reviewed

··· 42 42 }, 43 43 }); 44 44 45 45 - interface ToggleButtonGroupProps 46 46 - extends Omit<AriaToggleButtonGroupProps, "className" | "style" | "children"> { 45 45 + interface ToggleButtonGroupProps extends Omit< 46 46 + AriaToggleButtonGroupProps, 47 47 + "className" | "style" | "children" 48 48 + > { 47 49 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 48 50 orientation?: "horizontal" | "vertical"; 49 51 children?: React.ReactNode;

+4 -2

apps/example/src/components/toggle-button/index.tsx

reviewed

··· 91 91 }, 92 92 }); 93 93 94 94 - export interface ToggleButtonProps 95 95 - extends Omit<AriaToggleButtonProps, "style" | "className" | "children"> { 94 94 + export interface ToggleButtonProps extends Omit< 95 95 + AriaToggleButtonProps, 96 96 + "style" | "className" | "children" 97 97 + > { 96 98 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 97 99 variant?: Exclude<ButtonVariant, "critical">; 98 100 size?: Size;

+2 -1

apps/example/src/components/tooltip/index.tsx

reviewed

··· 62 62 }); 63 63 64 64 interface TooltipProps 65 65 - extends TooltipTriggerComponentProps, 65 65 + extends 66 66 + TooltipTriggerComponentProps, 66 67 Pick<AriaTooltipProps, "crossOffset" | "placement" | "shouldFlip"> { 67 68 text: string; 68 69 children: React.ReactNode;

+10 -5

apps/example/src/components/tree/index.tsx

reviewed

··· 80 80 }, 81 81 }); 82 82 83 83 - interface TreeItemContentProps 84 84 - extends Omit<AriaTreeItemContentProps, "children"> { 83 83 + interface TreeItemContentProps extends Omit< 84 84 + AriaTreeItemContentProps, 85 85 + "children" 86 86 + > { 85 87 children?: React.ReactNode; 86 88 prefix?: React.ReactNode; 87 89 suffix?: React.ReactNode; ··· 145 147 } 146 148 147 149 interface TreeItemProps<T extends object> 148 148 - extends Omit<AriaTreeItemProps<T>, "style" | "textValue" | "children">, 150 150 + extends 151 151 + Omit<AriaTreeItemProps<T>, "style" | "textValue" | "children">, 149 152 Pick<TreeItemContentProps, "prefix" | "suffix"> { 150 153 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 151 154 title: string; ··· 181 184 ); 182 185 } 183 186 184 184 - export interface TreeProps<T extends object> 185 185 - extends Omit<AriaTreeProps<T>, "children" | "style"> { 187 187 + export interface TreeProps<T extends object> extends Omit< 188 188 + AriaTreeProps<T>, 189 189 + "children" | "style" 190 190 + > { 186 191 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 187 192 children: React.ReactNode | ((item: T) => React.ReactNode); 188 193 size?: Size;

+48 -24

apps/example/src/components/typography/index.tsx

reviewed

··· 57 57 }, 58 58 }); 59 59 60 60 - export interface Heading1Props 61 61 - extends Omit<React.ComponentProps<"h1">, "style" | "className"> { 60 60 + export interface Heading1Props extends Omit< 61 61 + React.ComponentProps<"h1">, 62 62 + "style" | "className" 63 63 + > { 62 64 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 63 65 } 64 66 ··· 67 69 return <h1 {...stylex.props(typeramp.heading1, style)} {...props} />; 68 70 }; 69 71 70 70 - export interface Heading2Props 71 71 - extends Omit<React.ComponentProps<"h2">, "style" | "className"> { 72 72 + export interface Heading2Props extends Omit< 73 73 + React.ComponentProps<"h2">, 74 74 + "style" | "className" 75 75 + > { 72 76 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 73 77 } 74 78 ··· 77 81 return <h2 {...stylex.props(typeramp.heading2, style)} {...props} />; 78 82 }; 79 83 80 80 - export interface Heading3Props 81 81 - extends Omit<React.ComponentProps<"h3">, "style" | "className"> { 84 84 + export interface Heading3Props extends Omit< 85 85 + React.ComponentProps<"h3">, 86 86 + "style" | "className" 87 87 + > { 82 88 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 83 89 } 84 90 ··· 87 93 return <h3 {...stylex.props(typeramp.heading3, style)} {...props} />; 88 94 }; 89 95 90 90 - export interface Heading4Props 91 91 - extends Omit<React.ComponentProps<"h4">, "style" | "className"> { 96 96 + export interface Heading4Props extends Omit< 97 97 + React.ComponentProps<"h4">, 98 98 + "style" | "className" 99 99 + > { 92 100 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 93 101 } 94 102 ··· 97 105 return <h4 {...stylex.props(typeramp.heading4, style)} {...props} />; 98 106 }; 99 107 100 100 - export interface BodyProps 101 101 - extends Omit<React.ComponentProps<"p">, "style" | "className"> { 108 108 + export interface BodyProps extends Omit< 109 109 + React.ComponentProps<"p">, 110 110 + "style" | "className" 111 111 + > { 102 112 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 103 113 } 104 114 ··· 106 116 return <p {...stylex.props(typeramp.body, style)} {...props} />; 107 117 }; 108 118 109 109 - export interface SmallBodyProps 110 110 - extends Omit<React.ComponentProps<"p">, "style" | "className"> { 119 119 + export interface SmallBodyProps extends Omit< 120 120 + React.ComponentProps<"p">, 121 121 + "style" | "className" 122 122 + > { 111 123 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 112 124 variant?: "default" | "secondary"; 113 125 } ··· 129 141 ); 130 142 }; 131 143 132 132 - interface SubLabelProps 133 133 - extends Omit<React.ComponentProps<"p">, "style" | "className"> { 144 144 + interface SubLabelProps extends Omit< 145 145 + React.ComponentProps<"p">, 146 146 + "style" | "className" 147 147 + > { 134 148 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 135 149 variant?: "default" | "secondary"; 136 150 } ··· 161 175 ); 162 176 }; 163 177 164 164 - export interface BlockquoteProps 165 165 - extends Omit<React.ComponentProps<"blockquote">, "style" | "className"> { 178 178 + export interface BlockquoteProps extends Omit< 179 179 + React.ComponentProps<"blockquote">, 180 180 + "style" | "className" 181 181 + > { 166 182 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 167 183 } 168 184 ··· 170 186 return <blockquote {...stylex.props(styles.blockquote, style)} {...props} />; 171 187 }; 172 188 173 173 - export interface UnorderedListProps 174 174 - extends Omit<React.ComponentProps<"ul">, "style" | "className"> { 189 189 + export interface UnorderedListProps extends Omit< 190 190 + React.ComponentProps<"ul">, 191 191 + "style" | "className" 192 192 + > { 175 193 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 176 194 } 177 195 ··· 179 197 return <ul {...stylex.props(styles.unorderedList, style)} {...props} />; 180 198 }; 181 199 182 182 - export interface OrderedListProps 183 183 - extends Omit<React.ComponentProps<"ol">, "style" | "className"> { 200 200 + export interface OrderedListProps extends Omit< 201 201 + React.ComponentProps<"ol">, 202 202 + "style" | "className" 203 203 + > { 184 204 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 185 205 } 186 206 ··· 188 208 return <ol {...stylex.props(styles.orderedList, style)} {...props} />; 189 209 }; 190 210 191 191 - export interface ListItemProps 192 192 - extends Omit<React.ComponentProps<"li">, "style" | "className"> { 211 211 + export interface ListItemProps extends Omit< 212 212 + React.ComponentProps<"li">, 213 213 + "style" | "className" 214 214 + > { 193 215 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 194 216 } 195 217 ··· 197 219 return <li {...stylex.props(styles.listItem, style)} {...props} />; 198 220 }; 199 221 200 200 - export interface InlineCodeProps 201 201 - extends Omit<React.ComponentProps<"code">, "style" | "className"> { 222 222 + export interface InlineCodeProps extends Omit< 223 223 + React.ComponentProps<"code">, 224 224 + "style" | "className" 225 225 + > { 202 226 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 203 227 } 204 228

-1

apps/example/src/pages.gen.ts

reviewed

··· 3 3 // prettier-ignore 4 4 import type { PathsForPages, GetConfigResponse } from 'waku/router'; 5 5 6 6 - 7 6 // prettier-ignore 8 7 type Page = 9 8 | { path: '/'; render: 'dynamic' };

+1 -1

package.json

reviewed

··· 9 9 "check-types": "turbo run check-types" 10 10 }, 11 11 "devDependencies": { 12 12 - "prettier": "^3.6.2", 12 12 + "prettier": "^3.7.4", 13 13 "turbo": "^2.5.8", 14 14 "typescript": "catalog:" 15 15 },

+9 -6

packages/hip-ui/src/components/alert-dialog/index.tsx

reviewed

··· 98 98 ); 99 99 }; 100 100 101 101 - export interface AlertDialogHeaderProps 102 102 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 101 101 + export interface AlertDialogHeaderProps extends StyleXComponentProps< 102 102 + React.ComponentProps<"div"> 103 103 + > {} 103 104 104 105 export const AlertDialogHeader = ({ 105 106 children, ··· 115 116 ); 116 117 }; 117 118 118 118 - export interface AlertDialogDescriptionProps 119 119 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 119 119 + export interface AlertDialogDescriptionProps extends StyleXComponentProps< 120 120 + React.ComponentProps<"div"> 121 121 + > {} 120 122 121 123 export const AlertDialogDescription = ({ 122 124 children, ··· 129 131 ); 130 132 }; 131 133 132 132 - export interface AlertDialogFooterProps 133 133 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 134 134 + export interface AlertDialogFooterProps extends StyleXComponentProps< 135 135 + React.ComponentProps<"div"> 136 136 + > {} 134 137 135 138 export const AlertDialogFooter = ({ 136 139 children,

-1

packages/hip-ui/src/components/alert/alert-config.ts

reviewed

··· 17 17 "lucide-react": "^0.263.1", 18 18 }, 19 19 }; 20 20 -

+4 -2

packages/hip-ui/src/components/alert/index.tsx

reviewed

··· 247 247 248 248 export type AlertVariant = "info" | "success" | "warning" | "critical"; 249 249 250 250 - export interface AlertProps 251 251 - extends Omit<StyleXComponentProps<React.ComponentProps<"div">>, "title"> { 250 250 + export interface AlertProps extends Omit< 251 251 + StyleXComponentProps<React.ComponentProps<"div">>, 252 252 + "title" 253 253 + > { 252 254 /** 253 255 * The variant of the alert. 254 256 * @default "info"

+6 -4

packages/hip-ui/src/components/aspect-ratio/index.tsx

reviewed

··· 43 43 }, 44 44 }); 45 45 46 46 - export interface AspectRatioProps 47 47 - extends StyleXComponentProps<React.ComponentProps<"div">> { 46 46 + export interface AspectRatioProps extends StyleXComponentProps< 47 47 + React.ComponentProps<"div"> 48 48 + > { 48 49 aspectRatio?: number; 49 50 rounded?: boolean; 50 51 } ··· 68 69 ); 69 70 } 70 71 71 71 - export interface AspectRatioImageProps 72 72 - extends StyleXComponentProps<React.ComponentProps<"img">> {} 72 72 + export interface AspectRatioImageProps extends StyleXComponentProps< 73 73 + React.ComponentProps<"img"> 74 74 + > {} 73 75 74 76 export function AspectRatioImage({ style, ...props }: AspectRatioImageProps) { 75 77 return (

+3 -2

packages/hip-ui/src/components/avatar/index.tsx

reviewed

··· 86 86 }, 87 87 }); 88 88 89 89 - export interface AvatarProps 90 90 - extends StyleXComponentProps<Omit<React.ComponentProps<"div">, "children">> { 89 89 + export interface AvatarProps extends StyleXComponentProps< 90 90 + Omit<React.ComponentProps<"div">, "children"> 91 91 + > { 91 92 /** The source of the image. */ 92 93 src?: string; 93 94 /** The alt text of the image. */

+3 -2

packages/hip-ui/src/components/badge/index.tsx

reviewed

··· 68 68 }, 69 69 }); 70 70 71 71 - export interface BadgeProps 72 72 - extends StyleXComponentProps<React.ComponentProps<"div">> { 71 71 + export interface BadgeProps extends StyleXComponentProps< 72 72 + React.ComponentProps<"div"> 73 73 + > { 73 74 size?: Extract<Size, "sm" | "md">; 74 75 variant?: "primary" | "default" | "warning" | "critical" | "success"; 75 76 }

+6 -4

packages/hip-ui/src/components/breadcrumbs/index.tsx

reviewed

··· 51 51 }, 52 52 }); 53 53 54 54 - export interface BreadcrumbsProps<T extends object = object> 55 55 - extends StyleXComponentProps<Omit<AriaBreadcrumbsProps<T>, "children">> { 54 54 + export interface BreadcrumbsProps< 55 55 + T extends object = object, 56 56 + > extends StyleXComponentProps<Omit<AriaBreadcrumbsProps<T>, "children">> { 56 57 isDisabled?: boolean; 57 58 children?: React.ReactNode; 58 59 } 59 60 60 60 - export interface BreadcrumbProps 61 61 - extends StyleXComponentProps<Omit<AriaBreadcrumbProps, "children">> { 61 61 + export interface BreadcrumbProps extends StyleXComponentProps< 62 62 + Omit<AriaBreadcrumbProps, "children"> 63 63 + > { 62 64 children?: React.ReactNode; 63 65 } 64 66

+2 -1

packages/hip-ui/src/components/calendar/index.tsx

reviewed

··· 21 21 import { useCalendarStyles } from "../theme/useCalendarStyles"; 22 22 23 23 export interface CalendarProps<T extends DateValue> 24 24 - extends StyleXComponentProps<AriaCalendarProps<T>>, 24 24 + extends 25 25 + StyleXComponentProps<AriaCalendarProps<T>>, 25 26 Pick<CalendarGridProps, "weekdayStyle"> { 26 27 errorMessage?: string; 27 28 }

+24 -16

packages/hip-ui/src/components/card/index.tsx

reviewed

··· 99 99 }, 100 100 }); 101 101 102 102 - export interface CardProps 103 103 - extends StyleXComponentProps<React.ComponentProps<"div">> { 102 102 + export interface CardProps extends StyleXComponentProps< 103 103 + React.ComponentProps<"div"> 104 104 + > { 104 105 size?: Size; 105 106 } 106 107 ··· 118 119 ); 119 120 }; 120 121 121 121 - export interface CardHeaderProps 122 122 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 122 122 + export interface CardHeaderProps extends StyleXComponentProps< 123 123 + React.ComponentProps<"div"> 124 124 + > {} 123 125 124 126 export const CardHeader = ({ style, ...props }: CardHeaderProps) => { 125 127 return ( ··· 130 132 ); 131 133 }; 132 134 133 133 - export interface CardTitleProps 134 134 - extends StyleXComponentProps<React.ComponentProps<"h2">> {} 135 135 + export interface CardTitleProps extends StyleXComponentProps< 136 136 + React.ComponentProps<"h2"> 137 137 + > {} 135 138 136 139 export const CardTitle = ({ style, ...props }: CardTitleProps) => { 137 140 return <div {...props} {...stylex.props(styles.cardTitle, style)} />; 138 141 }; 139 142 140 140 - export interface CardDescriptionProps 141 141 - extends StyleXComponentProps<React.ComponentProps<"p">> {} 143 143 + export interface CardDescriptionProps extends StyleXComponentProps< 144 144 + React.ComponentProps<"p"> 145 145 + > {} 142 146 143 147 export const CardDescription = ({ style, ...props }: CardDescriptionProps) => { 144 148 return ( ··· 150 154 ); 151 155 }; 152 156 153 153 - export interface CardHeaderActionProps 154 154 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 157 157 + export interface CardHeaderActionProps extends StyleXComponentProps< 158 158 + React.ComponentProps<"div"> 159 159 + > {} 155 160 156 161 export const CardHeaderAction = ({ 157 162 style, ··· 159 164 }: CardHeaderActionProps) => { 160 165 return <div {...props} {...stylex.props(styles.cardHeaderAction, style)} />; 161 166 }; 162 162 - export interface CardBodyProps 163 163 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 167 167 + export interface CardBodyProps extends StyleXComponentProps< 168 168 + React.ComponentProps<"div"> 169 169 + > {} 164 170 165 171 export const CardBody = ({ style, ...props }: CardBodyProps) => { 166 172 return ( ··· 171 177 ); 172 178 }; 173 179 174 174 - export interface CardFooterProps 175 175 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 180 180 + export interface CardFooterProps extends StyleXComponentProps< 181 181 + React.ComponentProps<"div"> 182 182 + > {} 176 183 177 184 export const CardFooter = ({ style, ...props }: CardFooterProps) => { 178 185 return ( ··· 183 190 ); 184 191 }; 185 192 186 186 - export interface CardImageProps 187 187 - extends StyleXComponentProps<React.ComponentProps<"img">> { 193 193 + export interface CardImageProps extends StyleXComponentProps< 194 194 + React.ComponentProps<"img"> 195 195 + > { 188 196 aspectRatio?: number; 189 197 } 190 198

+6 -4

packages/hip-ui/src/components/checkbox/index.tsx

reviewed

··· 61 61 }, 62 62 }); 63 63 64 64 - interface CheckboxGroupProps 65 65 - extends StyleXComponentProps<Omit<AriaCheckboxGroupProps, "children">> { 64 64 + interface CheckboxGroupProps extends StyleXComponentProps< 65 65 + Omit<AriaCheckboxGroupProps, "children"> 66 66 + > { 66 67 children?: React.ReactNode; 67 68 label?: React.ReactNode; 68 69 description?: string; ··· 95 96 ); 96 97 } 97 98 98 98 - export interface CheckboxProps 99 99 - extends StyleXComponentProps<Omit<AriaCheckboxProps, "children">> { 99 99 + export interface CheckboxProps extends StyleXComponentProps< 100 100 + Omit<AriaCheckboxProps, "children"> 101 101 + > { 100 102 children?: React.ReactNode; 101 103 } 102 104

+3 -2

packages/hip-ui/src/components/color-area/index.tsx

reviewed

··· 69 69 return <AriaColorThumb {...props} {...stylex.props(styles.thumb, style)} />; 70 70 } 71 71 72 72 - export interface ColorAreaProps 73 73 - extends StyleXComponentProps<Omit<AriaColorAreaProps, "children">> { 72 72 + export interface ColorAreaProps extends StyleXComponentProps< 73 73 + Omit<AriaColorAreaProps, "children"> 74 74 + > { 74 75 children?: React.ReactNode; 75 76 aspectRatio?: number; 76 77 }

+2 -1

packages/hip-ui/src/components/color-field/index.tsx

reviewed

··· 85 85 } 86 86 87 87 export interface ColorFieldProps 88 88 - extends StyleXComponentProps<Omit<AriaColorFieldProps, "isInvalid">>, 88 88 + extends 89 89 + StyleXComponentProps<Omit<AriaColorFieldProps, "isInvalid">>, 89 90 Pick<InputProps, "placeholder"> { 90 91 label?: React.ReactNode; 91 92 description?: string;

+2 -1

packages/hip-ui/src/components/color-picker/index.tsx

reviewed

··· 80 80 }); 81 81 82 82 export interface ColorPickerProps 83 83 - extends StyleXComponentProps<Omit<AriaColorPickerProps, "children">>, 83 83 + extends 84 84 + StyleXComponentProps<Omit<AriaColorPickerProps, "children">>, 84 85 Pick<PopoverProps, "placement"> { 85 86 children?: React.ReactNode; 86 87 size?: Size;

+3 -2

packages/hip-ui/src/components/color-slider/index.tsx

reviewed

··· 68 68 }, 69 69 }); 70 70 71 71 - export interface ColorAreaProps 72 72 - extends StyleXComponentProps<Omit<AriaColorSliderProps, "children">> { 71 71 + export interface ColorAreaProps extends StyleXComponentProps< 72 72 + Omit<AriaColorSliderProps, "children"> 73 73 + > { 73 74 label?: string; 74 75 showValueLabel?: boolean; 75 76 size?: Size;

+6 -6

packages/hip-ui/src/components/color-swatch-picker/index.tsx

reviewed

··· 56 56 }, 57 57 }); 58 58 59 59 - export interface ColorSwatchPickerProps 60 60 - extends StyleXComponentProps<Omit<AriaColorSwatchPickerProps, "children">> { 59 59 + export interface ColorSwatchPickerProps extends StyleXComponentProps< 60 60 + Omit<AriaColorSwatchPickerProps, "children"> 61 61 + > { 61 62 children?: React.ReactNode; 62 63 layout?: "grid" | "stack"; 63 64 size?: Size; ··· 86 87 ); 87 88 } 88 89 89 89 - export interface ColorSwatchPickerItemProps 90 90 - extends StyleXComponentProps< 91 91 - Omit<AriaColorSwatchPickerItemProps, "children"> 92 92 - > {} 90 90 + export interface ColorSwatchPickerItemProps extends StyleXComponentProps< 91 91 + Omit<AriaColorSwatchPickerItemProps, "children"> 92 92 + > {} 93 93 94 94 export function ColorSwatchPickerItem({ 95 95 style,

+3 -2

packages/hip-ui/src/components/color-swatch/index.tsx

reviewed

··· 47 47 }, 48 48 }); 49 49 50 50 - export interface ColorSwatchProps 51 51 - extends StyleXComponentProps<Omit<AriaColorSwatchProps, "children">> { 50 50 + export interface ColorSwatchProps extends StyleXComponentProps< 51 51 + Omit<AriaColorSwatchProps, "children"> 52 52 + > { 52 53 children?: React.ReactNode; 53 54 size?: Size; 54 55 }

+3 -4

packages/hip-ui/src/components/color-wheel/index.tsx

reviewed

··· 34 34 }, 35 35 }); 36 36 37 37 - export interface ColorWheelProps 38 38 - extends StyleXComponentProps< 39 39 - Omit<AriaColorWheelProps, "children" | "outerRadius" | "innerRadius"> 40 40 - > { 37 37 + export interface ColorWheelProps extends StyleXComponentProps< 38 38 + Omit<AriaColorWheelProps, "children" | "outerRadius" | "innerRadius"> 39 39 + > { 41 40 size?: Size; 42 41 width: number; 43 42 }

+2 -3

packages/hip-ui/src/components/combobox/index.tsx

reviewed

··· 155 155 } 156 156 157 157 export interface ComboBoxProps<T extends object> 158 158 - extends StyleXComponentProps< 159 159 - Omit<AriaComboBoxProps<T>, "children" | "isInvalid"> 160 160 - >, 158 158 + extends 159 159 + StyleXComponentProps<Omit<AriaComboBoxProps<T>, "children" | "isInvalid">>, 161 160 Pick< 162 161 PopoverProps, 163 162 | "shouldCloseOnInteractOutside"

+2 -1

packages/hip-ui/src/components/command-menu/index.tsx

reviewed

··· 40 40 }); 41 41 42 42 export interface CommandMenuProps<T extends object> 43 43 - extends OverlayTriggerProps, 43 43 + extends 44 44 + OverlayTriggerProps, 44 45 Pick<InputProps, "placeholder">, 45 46 AriaAutocompleteProps<T> { 46 47 children: React.ReactNode;

+2 -1

packages/hip-ui/src/components/context-menu/index.tsx

reviewed

··· 137 137 } 138 138 139 139 export interface ContextMenuProps<T extends object> 140 140 - extends OverlayTriggerProps, 140 140 + extends 141 141 + OverlayTriggerProps, 141 142 StyleXComponentProps<Omit<AriaMenuProps<T>, "children">>, 142 143 Pick< 143 144 PopoverProps,

+3 -2

packages/hip-ui/src/components/date-field/index.tsx

reviewed

··· 81 81 ); 82 82 } 83 83 84 84 - export interface DateFieldProps<T extends DateValue> 85 85 - extends StyleXComponentProps<Omit<AriaDateFieldProps<T>, "isInvalid">> { 84 84 + export interface DateFieldProps< 85 85 + T extends DateValue, 86 86 + > extends StyleXComponentProps<Omit<AriaDateFieldProps<T>, "isInvalid">> { 86 87 label?: React.ReactNode; 87 88 description?: string; 88 89 errorMessage?: string | ((validation: ValidationResult) => string);

+2 -1

packages/hip-ui/src/components/date-picker/index.tsx

reviewed

··· 27 27 import { usePopoverStyles } from "../theme/usePopoverStyles"; 28 28 29 29 export interface DatePickerProps<T extends DateValue> 30 30 - extends StyleXComponentProps<Omit<AriaDatePickerProps<T>, "isInvalid">>, 30 30 + extends 31 31 + StyleXComponentProps<Omit<AriaDatePickerProps<T>, "isInvalid">>, 31 32 Pick<CalendarProps<T>, "weekdayStyle" | "visibleDuration"> { 32 33 label?: React.ReactNode; 33 34 description?: string;

+2 -1

packages/hip-ui/src/components/date-range-picker/index.tsx

reviewed

··· 31 31 import { usePopoverStyles } from "../theme/usePopoverStyles"; 32 32 33 33 export interface DateRangePickerProps<T extends DateValue> 34 34 - extends StyleXComponentProps<Omit<AriaDateRangePickerProps<T>, "isInvalid">>, 34 34 + extends 35 35 + StyleXComponentProps<Omit<AriaDateRangePickerProps<T>, "isInvalid">>, 35 36 Pick<RangeCalendarProps<T>, "weekdayStyle" | "visibleDuration"> { 36 37 label?: React.ReactNode; 37 38 description?: string;

+12 -8

packages/hip-ui/src/components/dialog/index.tsx

reviewed

··· 100 100 ); 101 101 }; 102 102 103 103 - export interface DialogHeaderProps 104 104 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 103 103 + export interface DialogHeaderProps extends StyleXComponentProps< 104 104 + React.ComponentProps<"div"> 105 105 + > {} 105 106 106 107 export const DialogHeader = ({ children, style }: DialogHeaderProps) => { 107 108 return ( ··· 114 115 ); 115 116 }; 116 117 117 117 - export interface DialogDescriptionProps 118 118 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 118 118 + export interface DialogDescriptionProps extends StyleXComponentProps< 119 119 + React.ComponentProps<"div"> 120 120 + > {} 119 121 120 122 export const DialogDescription = ({ 121 123 children, ··· 128 130 ); 129 131 }; 130 132 131 131 - export interface DialogBodyProps 132 132 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 133 133 + export interface DialogBodyProps extends StyleXComponentProps< 134 134 + React.ComponentProps<"div"> 135 135 + > {} 133 136 134 137 export const DialogBody = ({ children, style }: DialogBodyProps) => { 135 138 return <div {...stylex.props(styles.body, style)}>{children}</div>; 136 139 }; 137 140 138 138 - export interface DialogFooterProps 139 139 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 141 141 + export interface DialogFooterProps extends StyleXComponentProps< 142 142 + React.ComponentProps<"div"> 143 143 + > {} 140 144 141 145 export const DialogFooter = ({ children, style }: DialogFooterProps) => { 142 146 return <div {...stylex.props(styles.footer, style)}>{children}</div>;

+4 -4

packages/hip-ui/src/components/disclosure-group/index.tsx

reviewed

··· 25 25 }, 26 26 }); 27 27 28 28 - export interface DisclosureGroupProps 29 29 - extends StyleXComponentProps<AriaDisclosureGroupProps> { 28 28 + export interface DisclosureGroupProps extends StyleXComponentProps<AriaDisclosureGroupProps> { 30 29 size?: Size; 31 30 } 32 31 ··· 48 47 ); 49 48 } 50 49 51 51 - export interface SeparatorProps 52 52 - extends StyleXComponentProps<React.HTMLAttributes<HTMLDivElement>> {} 50 50 + export interface SeparatorProps extends StyleXComponentProps< 51 51 + React.HTMLAttributes<HTMLDivElement> 52 52 + > {} 53 53 54 54 export function DisclosureGroupSeparator({ style, ...props }: SeparatorProps) { 55 55 return <div {...props} {...stylex.props(styles.separator, style)} />;

+9 -6

packages/hip-ui/src/components/disclosure/index.tsx

reviewed

··· 103 103 }, 104 104 }); 105 105 106 106 - export interface DisclosureProps 107 107 - extends StyleXComponentProps<Omit<AriaDisclosureProps, "children">> { 106 106 + export interface DisclosureProps extends StyleXComponentProps< 107 107 + Omit<AriaDisclosureProps, "children"> 108 108 + > { 108 109 children: React.ReactNode; 109 110 size?: Size; 110 111 } ··· 128 129 ); 129 130 } 130 131 131 131 - export interface DisclosureTitleProps 132 132 - extends StyleXComponentProps<Omit<AriaButtonProps, "slot" | "children">> { 132 132 + export interface DisclosureTitleProps extends StyleXComponentProps< 133 133 + Omit<AriaButtonProps, "slot" | "children"> 134 134 + > { 133 135 children: React.ReactNode; 134 136 } 135 137 ··· 154 156 ); 155 157 } 156 158 157 157 - export interface DisclosurePanelProps 158 158 - extends StyleXComponentProps<Omit<AriaDisclosurePanelProps, "children">> { 159 159 + export interface DisclosurePanelProps extends StyleXComponentProps< 160 160 + Omit<AriaDisclosurePanelProps, "children"> 161 161 + > { 159 162 children: React.ReactNode; 160 163 isQuiet?: boolean; 161 164 }

+12 -8

packages/hip-ui/src/components/drawer/index.tsx

reviewed

··· 208 208 ); 209 209 }; 210 210 211 211 - export interface DrawerHeaderProps 212 212 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 211 211 + export interface DrawerHeaderProps extends StyleXComponentProps< 212 212 + React.ComponentProps<"div"> 213 213 + > {} 213 214 214 215 export const DrawerHeader = ({ children, style }: DrawerHeaderProps) => { 215 216 return ( ··· 222 223 ); 223 224 }; 224 225 225 225 - export interface DrawerDescriptionProps 226 226 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 226 226 + export interface DrawerDescriptionProps extends StyleXComponentProps< 227 227 + React.ComponentProps<"div"> 228 228 + > {} 227 229 228 230 export const DrawerDescription = ({ 229 231 children, ··· 236 238 ); 237 239 }; 238 240 239 239 - export interface DrawerBodyProps 240 240 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 241 241 + export interface DrawerBodyProps extends StyleXComponentProps< 242 242 + React.ComponentProps<"div"> 243 243 + > {} 241 244 242 245 export const DrawerBody = ({ children, style }: DrawerBodyProps) => { 243 246 return <div {...stylex.props(styles.body, style)}>{children}</div>; 244 247 }; 245 248 246 246 - export interface DrawerFooterProps 247 247 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 249 249 + export interface DrawerFooterProps extends StyleXComponentProps< 250 250 + React.ComponentProps<"div"> 251 251 + > {} 248 252 249 253 export const DrawerFooter = ({ children, style }: DrawerFooterProps) => { 250 254 return <div {...stylex.props(styles.footer, style)}>{children}</div>;

+3 -4

packages/hip-ui/src/components/editable-text/index.tsx

reviewed

··· 58 58 }, 59 59 }); 60 60 61 61 - export interface EditableTextProps 62 62 - extends StyleXComponentProps< 63 63 - Omit<React.ComponentProps<"span">, "children" | "onChange"> 64 64 - > { 61 61 + export interface EditableTextProps extends StyleXComponentProps< 62 62 + Omit<React.ComponentProps<"span">, "children" | "onChange"> 63 63 + > { 65 64 /** 66 65 * The current value of the editable text. 67 66 */

+15 -12

packages/hip-ui/src/components/empty-state/index.tsx

reviewed

··· 112 112 }, 113 113 }); 114 114 115 115 - export interface EmptyStateProps 116 116 - extends StyleXComponentProps<React.ComponentProps<"div">> { 115 115 + export interface EmptyStateProps extends StyleXComponentProps< 116 116 + React.ComponentProps<"div"> 117 117 + > { 117 118 /** 118 119 * The size of the empty state component. 119 120 * @default "md" ··· 137 138 ); 138 139 }; 139 140 140 140 - export interface EmptyStateImageProps 141 141 - extends StyleXComponentProps< 142 142 - Omit<React.ComponentProps<"div">, "src" | "alt"> 143 143 - > { 141 141 + export interface EmptyStateImageProps extends StyleXComponentProps< 142 142 + Omit<React.ComponentProps<"div">, "src" | "alt"> 143 143 + > { 144 144 /** 145 145 * The source URL of the image. 146 146 * When provided, renders an img element instead of a div. ··· 171 171 ); 172 172 }; 173 173 174 174 - export interface EmptyStateTitleProps 175 175 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 174 174 + export interface EmptyStateTitleProps extends StyleXComponentProps< 175 175 + React.ComponentProps<"div"> 176 176 + > {} 176 177 177 178 export const EmptyStateTitle = ({ style, ...props }: EmptyStateTitleProps) => { 178 179 return <div {...props} {...stylex.props(styles.title, ui.text, style)} />; 179 180 }; 180 181 181 181 - export interface EmptyStateDescriptionProps 182 182 - extends StyleXComponentProps<React.ComponentProps<"p">> {} 182 182 + export interface EmptyStateDescriptionProps extends StyleXComponentProps< 183 183 + React.ComponentProps<"p"> 184 184 + > {} 183 185 184 186 export const EmptyStateDescription = ({ 185 187 style, ··· 190 192 ); 191 193 }; 192 194 193 193 - export interface EmptyStateActionsProps 194 194 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 195 195 + export interface EmptyStateActionsProps extends StyleXComponentProps< 196 196 + React.ComponentProps<"div"> 197 197 + > {} 195 198 196 199 export const EmptyStateActions = ({ 197 200 style,

+2 -1

packages/hip-ui/src/components/file-drop-zone/index.tsx

reviewed

··· 52 52 }); 53 53 54 54 interface FileDropZoneProps 55 55 - extends Omit<AriaFileTriggerProps, "className" | "style">, 55 55 + extends 56 56 + Omit<AriaFileTriggerProps, "className" | "style">, 56 57 Pick<DropZoneProps, "isDisabled"> { 57 58 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 58 59 onAddFiles?: (files: File[]) => void;

+3 -2

packages/hip-ui/src/components/flex/index.tsx

reviewed

··· 58 58 "gap-96": { gap: spacing["96"] }, 59 59 }); 60 60 61 61 - export interface FlexProps 62 62 - extends StyleXComponentProps<React.ComponentProps<"div">> { 61 61 + export interface FlexProps extends StyleXComponentProps< 62 62 + React.ComponentProps<"div"> 63 63 + > { 63 64 /** 64 65 * The direction of the flex container. 65 66 * @default "row"

-1

packages/hip-ui/src/components/footer/footer-config.ts

reviewed

··· 16 16 "react-aria-components": "^1.13.0", 17 17 }, 18 18 }; 19 19 -

+36 -24

packages/hip-ui/src/components/footer/index.tsx

reviewed

··· 182 182 /** 183 183 * Footer root component. Main container for footer content. 184 184 */ 185 185 - export interface FooterRootProps 186 186 - extends StyleXComponentProps<React.ComponentProps<"footer">> { 185 185 + export interface FooterRootProps extends StyleXComponentProps< 186 186 + React.ComponentProps<"footer"> 187 187 + > { 187 188 /** 188 189 * Centers all footer content. 189 190 */ ··· 207 208 /** 208 209 * Footer logo component. Displays a logo in the footer. 209 210 */ 210 210 - export interface FooterLogoProps 211 211 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 211 211 + export interface FooterLogoProps extends StyleXComponentProps< 212 212 + React.ComponentProps<"div"> 213 213 + > {} 212 214 213 215 export const FooterLogo = ({ style, children, ...props }: FooterLogoProps) => { 214 216 return ( ··· 222 224 * Footer section component. Generic container for footer content with max-width, margin, and padding. 223 225 * Automatically adds a dim bottom border if it's not the last section. 224 226 */ 225 225 - export interface FooterSectionProps 226 226 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 227 227 + export interface FooterSectionProps extends StyleXComponentProps< 228 228 + React.ComponentProps<"div"> 229 229 + > {} 227 230 228 231 export const FooterSection = ({ 229 232 style, ··· 240 243 /** 241 244 * Footer navigation section component. Responsive grid container that displays 2 columns on smaller screens and 4 columns on larger screens. 242 245 */ 243 243 - export interface FooterNavSectionProps 244 244 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 246 246 + export interface FooterNavSectionProps extends StyleXComponentProps< 247 247 + React.ComponentProps<"div"> 248 248 + > {} 245 249 246 250 export const FooterNavSection = ({ 247 251 style, ··· 253 257 /** 254 258 * Footer navigation group component. Container for grouping related footer content. 255 259 */ 256 256 - export interface FooterNavGroupProps 257 257 - extends StyleXComponentProps<React.ComponentProps<"div">> { 260 260 + export interface FooterNavGroupProps extends StyleXComponentProps< 261 261 + React.ComponentProps<"div"> 262 262 + > { 258 263 /** 259 264 * Optional title for the group. 260 265 */ ··· 280 285 /** 281 286 * Footer copyright component. Displays copyright information. 282 287 */ 283 283 - export interface FooterCopyrightProps 284 284 - extends StyleXComponentProps<React.ComponentProps<"p">> {} 288 288 + export interface FooterCopyrightProps extends StyleXComponentProps< 289 289 + React.ComponentProps<"p"> 290 290 + > {} 285 291 286 292 export const FooterCopyright = ({ 287 293 style, ··· 298 304 /** 299 305 * Footer social link list component. Container for social media links. 300 306 */ 301 301 - export interface FooterSocialLinkListProps 302 302 - extends StyleXComponentProps<React.ComponentProps<"nav">> {} 307 307 + export interface FooterSocialLinkListProps extends StyleXComponentProps< 308 308 + React.ComponentProps<"nav"> 309 309 + > {} 303 310 304 311 export const FooterSocialLinkList = ({ 305 312 style, ··· 320 327 /** 321 328 * Footer social link item component. Individual social media link. 322 329 */ 323 323 - export interface FooterSocialLinkItemProps 324 324 - extends StyleXComponentProps<Omit<AriaLinkProps, "children">> { 330 330 + export interface FooterSocialLinkItemProps extends StyleXComponentProps< 331 331 + Omit<AriaLinkProps, "children"> 332 332 + > { 325 333 /** 326 334 * Icon to display in the link. Typically from lucide-react. 327 335 */ ··· 358 366 /** 359 367 * Footer subscribe component. Container for newsletter subscription section. 360 368 */ 361 361 - export interface FooterSubscribeProps 362 362 - extends StyleXComponentProps<React.ComponentProps<"div">> { 369 369 + export interface FooterSubscribeProps extends StyleXComponentProps< 370 370 + React.ComponentProps<"div"> 371 371 + > { 363 372 /** 364 373 * Layout variant. "horizontal" displays title/description on left and input on right. "vertical" stacks everything. 365 374 */ ··· 386 395 /** 387 396 * Footer subscribe title component. Displays the subscription section title. 388 397 */ 389 389 - export interface FooterSubscribeTitleProps 390 390 - extends StyleXComponentProps<React.ComponentProps<"h3">> {} 398 398 + export interface FooterSubscribeTitleProps extends StyleXComponentProps< 399 399 + React.ComponentProps<"h3"> 400 400 + > {} 391 401 392 402 export const FooterSubscribeTitle = ({ 393 403 style, ··· 404 414 /** 405 415 * Footer subscribe description component. Displays the subscription section description. 406 416 */ 407 407 - export interface FooterSubscribeDescriptionProps 408 408 - extends StyleXComponentProps<React.ComponentProps<"p">> {} 417 417 + export interface FooterSubscribeDescriptionProps extends StyleXComponentProps< 418 418 + React.ComponentProps<"p"> 419 419 + > {} 409 420 410 421 export const FooterSubscribeDescription = ({ 411 422 style, ··· 425 436 /** 426 437 * Footer subscribe input component. Contains an email input field and subscribe button. 427 438 */ 428 428 - export interface FooterSubscribeInputProps 429 429 - extends StyleXComponentProps<React.ComponentProps<"form">> { 439 439 + export interface FooterSubscribeInputProps extends StyleXComponentProps< 440 440 + React.ComponentProps<"form"> 441 441 + > { 430 442 /** 431 443 * Callback function called when the form is submitted. 432 444 */

+6 -4

packages/hip-ui/src/components/grid/index.tsx

reviewed

··· 107 107 rowEnd: (end: number) => ({ gridRowEnd: end }), 108 108 }); 109 109 110 110 - export interface GridProps 111 111 - extends StyleXComponentProps<React.ComponentProps<"div">> { 110 110 + export interface GridProps extends StyleXComponentProps< 111 111 + React.ComponentProps<"div"> 112 112 + > { 112 113 /** 113 114 * The grid template rows of the grid container. 114 115 * @default "auto" ··· 226 227 ); 227 228 }; 228 229 229 229 - interface GridItemProps 230 230 - extends StyleXComponentProps<React.ComponentProps<"div">> { 230 230 + interface GridItemProps extends StyleXComponentProps< 231 231 + React.ComponentProps<"div"> 232 232 + > { 231 233 columnStart?: number; 232 234 columnEnd?: number; 233 235 rowStart?: number;

-1

packages/hip-ui/src/components/header-layout/header-layout-config.ts

reviewed

··· 12 12 ], 13 13 dependencies: {}, 14 14 }; 15 15 -

+15 -10

packages/hip-ui/src/components/header-layout/index.tsx

reviewed

··· 83 83 /** 84 84 * Header layout root component. Main container for the page layout. 85 85 */ 86 86 - export interface HeaderLayoutRootProps 87 87 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 86 86 + export interface HeaderLayoutRootProps extends StyleXComponentProps< 87 87 + React.ComponentProps<"div"> 88 88 + > {} 88 89 89 90 export const HeaderLayoutRoot = ({ 90 91 style, ··· 96 97 /** 97 98 * Header layout header component. Slot for header content. 98 99 */ 99 99 - export interface HeaderLayoutHeaderProps 100 100 - extends StyleXComponentProps<React.ComponentProps<"header">> {} 100 100 + export interface HeaderLayoutHeaderProps extends StyleXComponentProps< 101 101 + React.ComponentProps<"header"> 102 102 + > {} 101 103 102 104 export const HeaderLayoutHeader = ({ 103 105 style, ··· 109 111 /** 110 112 * Header layout page component. Slot for main page content. 111 113 */ 112 112 - export interface HeaderLayoutPageProps 113 113 - extends StyleXComponentProps<React.ComponentProps<"main">> {} 114 114 + export interface HeaderLayoutPageProps extends StyleXComponentProps< 115 115 + React.ComponentProps<"main"> 116 116 + > {} 114 117 115 118 export const HeaderLayoutPage = ({ 116 119 style, ··· 122 125 /** 123 126 * Header layout footer component. Slot for footer content. 124 127 */ 125 125 - export interface HeaderLayoutFooterProps 126 126 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 128 128 + export interface HeaderLayoutFooterProps extends StyleXComponentProps< 129 129 + React.ComponentProps<"div"> 130 130 + > {} 127 131 128 132 export const HeaderLayoutFooter = ({ 129 133 style, ··· 136 140 * Header layout hero component. Full-width section with primary background color. 137 141 * Content follows the max-width constraint. 138 142 */ 139 139 - export interface HeaderLayoutHeroProps 140 140 - extends StyleXComponentProps<React.ComponentProps<"section">> {} 143 143 + export interface HeaderLayoutHeroProps extends StyleXComponentProps< 144 144 + React.ComponentProps<"section"> 145 145 + > {} 141 146 142 147 export const HeaderLayoutHero = ({ 143 148 style,

+4 -4

packages/hip-ui/src/components/hover-card/index.tsx

reviewed

··· 31 31 }, 32 32 }); 33 33 34 34 - interface HoverCardInnerProps 35 35 - extends StyleXComponentProps<Omit<AriaPopoverProps, "trigger">> { 34 34 + interface HoverCardInnerProps extends StyleXComponentProps< 35 35 + Omit<AriaPopoverProps, "trigger"> 36 36 + > { 36 37 trigger: React.ComponentProps<typeof Pressable>["children"]; 37 38 triggerName?: AriaPopoverProps["trigger"]; 38 39 children: React.ReactNode; ··· 109 110 } 110 111 111 112 export interface HoverCardProps 112 112 - extends DialogTriggerProps, 113 113 - HoverCardInnerProps {} 113 113 + extends DialogTriggerProps, HoverCardInnerProps {} 114 114 115 115 export const HoverCard = ({ 116 116 defaultOpen,

+3 -2

packages/hip-ui/src/components/kbd/index.tsx

reviewed

··· 28 28 }, 29 29 }); 30 30 31 31 - export interface KbdProps 32 32 - extends StyleXComponentProps<Omit<React.ComponentProps<"kbd">, "children">> { 31 31 + export interface KbdProps extends StyleXComponentProps< 32 32 + Omit<React.ComponentProps<"kbd">, "children"> 33 33 + > { 33 34 children: string; 34 35 } 35 36

+3 -2

packages/hip-ui/src/components/label/index.tsx

reviewed

··· 120 120 ); 121 121 } 122 122 123 123 - export interface FieldErrorMessageProps 124 124 - extends StyleXComponentProps<Omit<FieldErrorProps, "children">> { 123 123 + export interface FieldErrorMessageProps extends StyleXComponentProps< 124 124 + Omit<FieldErrorProps, "children"> 125 125 + > { 125 126 children?: string | ((validation: ValidationResult) => string) | undefined; 126 127 } 127 128

+3 -2

packages/hip-ui/src/components/link/index.tsx

reviewed

··· 55 55 }, 56 56 }); 57 57 58 58 - export interface LinkProps 59 59 - extends StyleXComponentProps<Omit<AriaLinkProps, "children">> { 58 58 + export interface LinkProps extends StyleXComponentProps< 59 59 + Omit<AriaLinkProps, "children"> 60 60 + > { 60 61 children: React.ReactNode; 61 62 } 62 63

+13 -10

packages/hip-ui/src/components/listbox/index.tsx

reviewed

··· 56 56 57 57 const ListboxVariantContext = createContext<ListBoxVariant>("default"); 58 58 59 59 - export interface ListBoxProps<T extends object> 60 60 - extends StyleXComponentProps<AriaListBoxProps<T>> { 59 59 + export interface ListBoxProps<T extends object> extends StyleXComponentProps< 60 60 + AriaListBoxProps<T> 61 61 + > { 61 62 size?: Size; 62 63 items?: Iterable<T>; 63 64 children: React.ReactNode | ((item: T) => React.ReactNode); ··· 95 96 ); 96 97 } 97 98 98 98 - export interface ListBoxItemProps 99 99 - extends StyleXComponentProps<Omit<AriaListBoxItemProps, "children">> { 99 99 + export interface ListBoxItemProps extends StyleXComponentProps< 100 100 + Omit<AriaListBoxItemProps, "children"> 101 101 + > { 100 102 children: React.ReactNode; 101 103 prefix?: React.ReactNode; 102 104 suffix?: React.ReactNode; ··· 165 167 ); 166 168 } 167 169 168 168 - export interface ListBoxSectionProps<T extends object> 169 169 - extends StyleXComponentProps<AriaListBoxSectionProps<T>> { 170 170 + export interface ListBoxSectionProps< 171 171 + T extends object, 172 172 + > extends StyleXComponentProps<AriaListBoxSectionProps<T>> { 170 173 children: React.ReactNode; 171 174 } 172 175 ··· 177 180 return <AriaListBoxSection {...props} {...stylex.props(style)} />; 178 181 } 179 182 180 180 - export interface ListBoxSeparatorProps 181 181 - extends StyleXComponentProps<SeparatorProps> {} 183 183 + export interface ListBoxSeparatorProps extends StyleXComponentProps<SeparatorProps> {} 182 184 183 185 export function ListBoxSeparator({ style, ...props }: ListBoxSeparatorProps) { 184 186 return <Separator {...props} style={[styles.separator, style]} />; 185 187 } 186 188 187 187 - export interface ListBoxSectionHeaderProps 188 188 - extends StyleXComponentProps<React.HTMLAttributes<HTMLElement>> {} 189 189 + export interface ListBoxSectionHeaderProps extends StyleXComponentProps< 190 190 + React.HTMLAttributes<HTMLElement> 191 191 + > {} 189 192 190 193 export function ListBoxSectionHeader({ 191 194 style,

+10 -6

packages/hip-ui/src/components/menu/index.tsx

reviewed

··· 44 44 }); 45 45 46 46 export interface MenuProps<T extends object> 47 47 - extends Omit<MenuTriggerProps, "trigger" | "children">, 47 47 + extends 48 48 + Omit<MenuTriggerProps, "trigger" | "children">, 48 49 Omit<AriaMenuProps<T>, "children" | "className" | "style">, 49 50 Pick< 50 51 PopoverProps, ··· 114 115 } 115 116 116 117 export interface SubMenuProps<T extends object> 117 117 - extends Omit<SubmenuTriggerProps, "trigger" | "children">, 118 118 + extends 119 119 + Omit<SubmenuTriggerProps, "trigger" | "children">, 118 120 Omit<AriaMenuProps<T>, "children" | "className" | "style">, 119 121 Pick< 120 122 PopoverProps, ··· 164 166 ); 165 167 } 166 168 167 167 - export interface MenuSectionProps<T extends object> 168 168 - extends StyleXComponentProps<AriaMenuSectionProps<T>> { 169 169 + export interface MenuSectionProps< 170 170 + T extends object, 171 171 + > extends StyleXComponentProps<AriaMenuSectionProps<T>> { 169 172 children: React.ReactNode; 170 173 } 171 174 ··· 176 179 return <AriaMenuSection {...props} {...stylex.props(style)} />; 177 180 } 178 181 179 179 - export interface MenuItemProps 180 180 - extends StyleXComponentProps<Omit<AriaMenuItemProps, "children">> { 182 182 + export interface MenuItemProps extends StyleXComponentProps< 183 183 + Omit<AriaMenuItemProps, "children"> 184 184 + > { 181 185 children: React.ReactNode; 182 186 prefix?: React.ReactNode; 183 187 suffix?: React.ReactNode;

+5 -3

packages/hip-ui/src/components/menubar/index.tsx

reviewed

··· 85 85 }, 86 86 }); 87 87 88 88 - export interface MenubarProps 89 89 - extends StyleXComponentProps<React.ComponentProps<"div">> { 88 88 + export interface MenubarProps extends StyleXComponentProps< 89 89 + React.ComponentProps<"div"> 90 90 + > { 90 91 size?: Size; 91 92 value?: string; 92 93 defaultValue?: string; ··· 126 127 } 127 128 128 129 export interface MenubarItemProps 129 129 - extends StyleXComponentProps<React.ComponentProps<"div">>, 130 130 + extends 131 131 + StyleXComponentProps<React.ComponentProps<"div">>, 130 132 Pick<ButtonProps, "isDisabled"> { 131 133 label: string; 132 134 }

+12 -8

packages/hip-ui/src/components/navbar/Navbar.tsx

reviewed

··· 217 217 }); 218 218 219 219 // Define subcomponents first so they can be referenced in Navbar 220 220 - export interface NavbarLogoProps 221 221 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 220 220 + export interface NavbarLogoProps extends StyleXComponentProps< 221 221 + React.ComponentProps<"div"> 222 222 + > {} 222 223 223 224 /** 224 225 * NavbarLogo component for displaying the logo in the navbar. ··· 231 232 ); 232 233 }; 233 234 234 234 - export interface NavbarNavigationProps 235 235 - extends StyleXComponentProps<React.ComponentProps<"div">> { 235 235 + export interface NavbarNavigationProps extends StyleXComponentProps< 236 236 + React.ComponentProps<"div"> 237 237 + > { 236 238 /** 237 239 * Justify content alignment for the navigation items. 238 240 * @default "left" ··· 265 267 ); 266 268 }; 267 269 268 268 - export interface NavbarActionProps 269 269 - extends StyleXComponentProps<React.ComponentProps<"div">> { 270 270 + export interface NavbarActionProps extends StyleXComponentProps< 271 271 + React.ComponentProps<"div"> 272 272 + > { 270 273 /** 271 274 * Whether the action should be always visible on mobile. 272 275 * @default false ··· 309 312 ); 310 313 } 311 314 312 312 - export interface NavbarProps 313 313 - extends StyleXComponentProps<React.ComponentProps<"div">> { 315 315 + export interface NavbarProps extends StyleXComponentProps< 316 316 + React.ComponentProps<"div"> 317 317 + > { 314 318 size?: Size; 315 319 } 316 320

+6 -4

packages/hip-ui/src/components/navbar/NavbarMenu.tsx

reviewed

··· 180 180 ); 181 181 } 182 182 183 183 - export interface NavbarMenuTriggerProps 184 184 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 183 183 + export interface NavbarMenuTriggerProps extends StyleXComponentProps< 184 184 + React.ComponentProps<"div"> 185 185 + > {} 185 186 186 187 export function NavbarMenuTrigger({ style, ...props }: NavbarMenuTriggerProps) { 187 188 return <div {...props} {...stylex.props(styles.link, style)} />; 188 189 } 189 190 190 190 - interface NavbarMenuItemProps 191 191 - extends StyleXComponentProps<Omit<React.ComponentProps<"div">, "children">> { 191 191 + interface NavbarMenuItemProps extends StyleXComponentProps< 192 192 + Omit<React.ComponentProps<"div">, "children"> 193 193 + > { 192 194 icon?: React.ReactNode; 193 195 label: string; 194 196 description?: string;

+2 -3

packages/hip-ui/src/components/number-field/index.tsx

reviewed

··· 197 197 } 198 198 199 199 export interface NumberFieldProps 200 200 - extends StyleXComponentProps< 201 201 - Omit<AriaNumberFieldProps, "children" | "isInvalid"> 202 202 - >, 200 200 + extends 201 201 + StyleXComponentProps<Omit<AriaNumberFieldProps, "children" | "isInvalid">>, 203 202 Pick<InputProps, "placeholder"> { 204 203 label?: React.ReactNode; 205 204 description?: string;

+3 -2

packages/hip-ui/src/components/pagination/index.tsx

reviewed

··· 43 43 }, 44 44 }); 45 45 46 46 - export interface PaginationProps 47 47 - extends StyleXComponentProps<React.ComponentProps<"div">> { 46 46 + export interface PaginationProps extends StyleXComponentProps< 47 47 + React.ComponentProps<"div"> 48 48 + > { 48 49 defaultSelectedPage?: number; 49 50 selectedPage?: number; 50 51 onSelectedPageChange?: (page: number) => void;

+2 -1

packages/hip-ui/src/components/popover/index.tsx

reviewed

··· 47 47 }, 48 48 }); 49 49 interface PopoverProps 50 50 - extends DialogTriggerProps, 50 50 + extends 51 51 + DialogTriggerProps, 51 52 StyleXComponentProps<Omit<AriaPopoverProps, "className" | "trigger">> { 52 53 trigger: React.ReactNode; 53 54 triggerName?: Pick<AriaPopoverProps, "trigger">;

+1 -2

packages/hip-ui/src/components/progress-bar/index.tsx

reviewed

··· 98 98 }, 99 99 }); 100 100 101 101 - export interface ProgressBarProps 102 102 - extends StyleXComponentProps<AriaProgresBarProps> { 101 101 + export interface ProgressBarProps extends StyleXComponentProps<AriaProgresBarProps> { 103 102 label?: string; 104 103 showValueLabel?: boolean; 105 104 size?: Size;

+3 -2

packages/hip-ui/src/components/progress-circle/index.tsx

reviewed

··· 108 108 }, 109 109 }); 110 110 111 111 - export interface ProgressCircleProps 112 112 - extends StyleXComponentProps<Omit<AriaProgressBarProps, "children">> { 111 111 + export interface ProgressCircleProps extends StyleXComponentProps< 112 112 + Omit<AriaProgressBarProps, "children"> 113 113 + > { 113 114 label?: string; 114 115 size?: Size; 115 116 }

+6 -4

packages/hip-ui/src/components/radio/index.tsx

reviewed

··· 95 95 }, 96 96 }); 97 97 98 98 - interface RadioGroupProps 99 99 - extends StyleXComponentProps<Omit<AriaRadioGroupProps, "children">> { 98 98 + interface RadioGroupProps extends StyleXComponentProps< 99 99 + Omit<AriaRadioGroupProps, "children"> 100 100 + > { 100 101 children?: React.ReactNode; 101 102 label?: React.ReactNode; 102 103 description?: string; ··· 129 130 ); 130 131 } 131 132 132 132 - export interface RadioProps 133 133 - extends StyleXComponentProps<Omit<AriaRadioProps, "children">> { 133 133 + export interface RadioProps extends StyleXComponentProps< 134 134 + Omit<AriaRadioProps, "children"> 135 135 + > { 134 136 children?: React.ReactNode; 135 137 } 136 138

+2 -1

packages/hip-ui/src/components/range-calendar/index.tsx

reviewed

··· 22 22 import { useCalendarStyles } from "../theme/useCalendarStyles"; 23 23 24 24 export interface RangeCalendarProps<T extends DateValue> 25 25 - extends StyleXComponentProps<AriaRangeCalendarProps<T>>, 25 25 + extends 26 26 + StyleXComponentProps<AriaRangeCalendarProps<T>>, 26 27 Pick<CalendarGridProps, "weekdayStyle"> { 27 28 errorMessage?: string; 28 29 }

+2 -1

packages/hip-ui/src/components/search-field/index.tsx

reviewed

··· 115 115 } 116 116 117 117 export interface SearchFieldProps 118 118 - extends StyleXComponentProps<Omit<AriaSearchFieldProps, "isInvalid">>, 118 118 + extends 119 119 + StyleXComponentProps<Omit<AriaSearchFieldProps, "isInvalid">>, 119 120 Pick<InputProps, "placeholder"> { 120 121 label?: React.ReactNode; 121 122 description?: string;

+9 -9

packages/hip-ui/src/components/segmented-control/index.tsx

reviewed

··· 101 101 }, 102 102 }); 103 103 104 104 - export interface SegmentedControlProps 105 105 - extends StyleXComponentProps< 106 106 - Omit< 107 107 - AriaToggleButtonGroupProps, 108 108 - "children" | "disallowEmptySelection" | "selectionMode" 109 109 - > 110 110 - > { 104 104 + export interface SegmentedControlProps extends StyleXComponentProps< 105 105 + Omit< 106 106 + AriaToggleButtonGroupProps, 107 107 + "children" | "disallowEmptySelection" | "selectionMode" 108 108 + > 109 109 + > { 111 110 children?: React.ReactNode; 112 111 size?: Size; 113 112 } ··· 133 132 ); 134 133 }; 135 134 136 136 - export interface SegmentedControlItemProps 137 137 - extends StyleXComponentProps<Omit<AriaToggleButtonProps, "children">> { 135 135 + export interface SegmentedControlItemProps extends StyleXComponentProps< 136 136 + Omit<AriaToggleButtonProps, "children"> 137 137 + > { 138 138 children?: React.ReactNode; 139 139 } 140 140

+2 -3

packages/hip-ui/src/components/select/index.tsx

reviewed

··· 165 165 } 166 166 167 167 export interface SelectProps<T extends object, M extends "single" | "multiple"> 168 168 - extends StyleXComponentProps< 169 169 - Omit<AriaSelectProps<T, M>, "children" | "isInvalid"> 170 170 - >, 168 168 + extends 169 169 + StyleXComponentProps<Omit<AriaSelectProps<T, M>, "children" | "isInvalid">>, 171 170 Pick< 172 171 PopoverProps, 173 172 | "shouldCloseOnInteractOutside"

+1 -2

packages/hip-ui/src/components/separator/index.tsx

reviewed

··· 23 23 }, 24 24 }); 25 25 26 26 - export interface SeparatorProps 27 27 - extends StyleXComponentProps<AriaSeparatorProps> {} 26 26 + export interface SeparatorProps extends StyleXComponentProps<AriaSeparatorProps> {} 28 27 29 28 export function Separator({ style, ...props }: SeparatorProps) { 30 29 return (

+9 -6

packages/hip-ui/src/components/sidebar/index.tsx

reviewed

··· 147 147 }, 148 148 }); 149 149 150 150 - export interface SidebarProps 151 151 - extends StyleXComponentProps<React.ComponentProps<"div">> { 150 150 + export interface SidebarProps extends StyleXComponentProps< 151 151 + React.ComponentProps<"div"> 152 152 + > { 152 153 children: React.ReactNode; 153 154 } 154 155 ··· 181 182 ); 182 183 } 183 184 184 184 - export interface SidebarHeaderProps 185 185 - extends StyleXComponentProps<React.ComponentProps<"div">> { 185 185 + export interface SidebarHeaderProps extends StyleXComponentProps< 186 186 + React.ComponentProps<"div"> 187 187 + > { 186 188 children: React.ReactNode; 187 189 href?: string; 188 190 linkComponent?: React.ComponentType<React.ComponentProps<"a">>; ··· 277 279 ); 278 280 } 279 281 280 280 - export interface SidebarItemProps 281 281 - extends StyleXComponentProps<React.ComponentProps<"li">> { 282 282 + export interface SidebarItemProps extends StyleXComponentProps< 283 283 + React.ComponentProps<"li"> 284 284 + > { 282 285 children: React.ReactNode; 283 286 isActive?: boolean; 284 287 }

+6 -4

packages/hip-ui/src/components/skeleton/index.tsx

reviewed

··· 79 79 }), 80 80 }); 81 81 82 82 - export interface SkeletonGroupProps 83 83 - extends StyleXComponentProps<React.ComponentProps<"div">> { 82 82 + export interface SkeletonGroupProps extends StyleXComponentProps< 83 83 + React.ComponentProps<"div"> 84 84 + > { 84 85 children: React.ReactNode; 85 86 } 86 87 ··· 98 99 99 100 export type SkeletonVariant = "circle" | "rectangle"; 100 101 101 101 - interface SkeletonBaseProps 102 102 - extends StyleXComponentProps<React.ComponentProps<"div">> {} 102 102 + interface SkeletonBaseProps extends StyleXComponentProps< 103 103 + React.ComponentProps<"div"> 104 104 + > {} 103 105 104 106 interface SkeletonCircleProps extends SkeletonBaseProps { 105 107 variant: "circle";

+3 -2

packages/hip-ui/src/components/switch/index.tsx

reviewed

··· 62 62 }, 63 63 }); 64 64 65 65 - interface SwitchBaseProps 66 66 - extends StyleXComponentProps<Omit<AriaSwitchProps, "children">> {} 65 65 + interface SwitchBaseProps extends StyleXComponentProps< 66 66 + Omit<AriaSwitchProps, "children"> 67 67 + > {} 67 68 68 69 interface SwitchWithChildrenProps extends SwitchBaseProps { 69 70 children: React.ReactNode;

+15 -10

packages/hip-ui/src/components/table/index.tsx

reviewed

··· 194 194 return <SizeContext value={size}>{table}</SizeContext>; 195 195 }; 196 196 197 197 - export interface TableColumnProps 198 198 - extends StyleXComponentProps<Omit<AriaColumnProps, "children">> { 197 197 + export interface TableColumnProps extends StyleXComponentProps< 198 198 + Omit<AriaColumnProps, "children"> 199 199 + > { 199 200 children?: React.ReactNode; 200 201 hasResizer?: boolean; 201 202 hasEllipsis?: boolean; ··· 240 241 ); 241 242 } 242 243 243 243 - export interface TableHeaderProps<T extends object> 244 244 - extends StyleXComponentProps<AriaTableHeaderProps<T>> {} 244 244 + export interface TableHeaderProps< 245 245 + T extends object, 246 246 + > extends StyleXComponentProps<AriaTableHeaderProps<T>> {} 245 247 246 248 export function TableHeader<T extends object>({ 247 249 children, ··· 268 270 ); 269 271 } 270 272 271 271 - export interface TableRowProps<T extends object> 272 272 - extends StyleXComponentProps<AriaRowProps<T>> {} 273 273 + export interface TableRowProps<T extends object> extends StyleXComponentProps< 274 274 + AriaRowProps<T> 275 275 + > {} 273 276 274 277 export function TableRow<T extends object>({ 275 278 id, ··· 299 302 ); 300 303 } 301 304 302 302 - export interface TableBodyProps<T extends object> 303 303 - extends StyleXComponentProps<AriaTableBodyProps<T>> {} 305 305 + export interface TableBodyProps<T extends object> extends StyleXComponentProps< 306 306 + AriaTableBodyProps<T> 307 307 + > {} 304 308 305 309 export function TableBody<T extends object>({ 306 310 style, ··· 309 313 return <AriaTableBody {...prop} {...stylex.props(styles.tableBody, style)} />; 310 314 } 311 315 312 312 - export interface TableCellProps 313 313 - extends StyleXComponentProps<Omit<AriaCellProps, "children">> { 316 316 + export interface TableCellProps extends StyleXComponentProps< 317 317 + Omit<AriaCellProps, "children"> 318 318 + > { 314 319 children?: React.ReactNode; 315 320 hasEllipsis?: boolean; 316 321 }

+12 -8

packages/hip-ui/src/components/tabs/index.tsx

reviewed

··· 183 183 }, 184 184 }); 185 185 186 186 - export interface TabsProps 187 187 - extends StyleXComponentProps<Omit<AriaTabsProps, "children">> { 186 186 + export interface TabsProps extends StyleXComponentProps< 187 187 + Omit<AriaTabsProps, "children"> 188 188 + > { 188 189 children: React.ReactNode; 189 190 size?: Size; 190 191 orientation?: "horizontal" | "vertical"; ··· 217 218 ); 218 219 } 219 220 220 220 - export interface TabListProps 221 221 - extends StyleXComponentProps<Omit<AriaTabListProps<object>, "children">> { 221 221 + export interface TabListProps extends StyleXComponentProps< 222 222 + Omit<AriaTabListProps<object>, "children"> 223 223 + > { 222 224 children: React.ReactNode; 223 225 } 224 226 ··· 230 232 ); 231 233 } 232 234 233 233 - export interface TabProps 234 234 - extends StyleXComponentProps<Omit<AriaTabProps, "children">> { 235 235 + export interface TabProps extends StyleXComponentProps< 236 236 + Omit<AriaTabProps, "children"> 237 237 + > { 235 238 children: React.ReactNode; 236 239 } 237 240 ··· 244 247 ); 245 248 } 246 249 247 247 - export interface TabPanelProps 248 248 - extends StyleXComponentProps<Omit<AriaTabPanelProps, "children">> { 250 250 + export interface TabPanelProps extends StyleXComponentProps< 251 251 + Omit<AriaTabPanelProps, "children"> 252 252 + > { 249 253 children: React.ReactNode; 250 254 } 251 255

+5 -3

packages/hip-ui/src/components/tag-group/index.tsx

reviewed

··· 97 97 }); 98 98 99 99 interface TagGroupBaseProps<T> 100 100 - extends StyleXComponentProps<Omit<AriaTagGroupProps, "children">>, 100 100 + extends 101 101 + StyleXComponentProps<Omit<AriaTagGroupProps, "children">>, 101 102 Pick<TagListProps<T>, "items" | "children" | "renderEmptyState"> { 102 103 label?: string; 103 104 description?: string; ··· 132 133 ); 133 134 } 134 135 135 135 - export interface TagProps 136 136 - extends StyleXComponentProps<Omit<AriaTagProps, "children">> { 136 136 + export interface TagProps extends StyleXComponentProps< 137 137 + Omit<AriaTagProps, "children"> 138 138 + > { 137 139 children?: React.ReactNode; 138 140 } 139 141

+2 -1

packages/hip-ui/src/components/text-area/index.tsx

reviewed

··· 122 122 }); 123 123 124 124 export interface TextAreaProps 125 125 - extends StyleXComponentProps<Omit<TextFieldProps, "children">>, 125 125 + extends 126 126 + StyleXComponentProps<Omit<TextFieldProps, "children">>, 126 127 Pick<AriaTextAreaProps, "rows">, 127 128 Pick<InputProps, "placeholder"> { 128 129 label?: React.ReactNode;

+2 -1

packages/hip-ui/src/components/text-field/index.tsx

reviewed

··· 129 129 } 130 130 131 131 export interface TextFieldProps 132 132 - extends StyleXComponentProps<Omit<AriaTextFieldProps, "isInvalid">>, 132 132 + extends 133 133 + StyleXComponentProps<Omit<AriaTextFieldProps, "isInvalid">>, 133 134 Pick<InputProps, "placeholder"> { 134 135 label?: React.ReactNode; 135 136 description?: string;

+2 -1

packages/hip-ui/src/components/theme/useCalendarStyles.ts

reviewed

··· 14 14 import { fontSize, fontWeight } from "./typography.stylex"; 15 15 16 16 export interface CalendarProps<T extends DateValue> 17 17 - extends StyleXComponentProps<AriaCalendarProps<T>>, 17 17 + extends 18 18 + StyleXComponentProps<AriaCalendarProps<T>>, 18 19 Pick<CalendarGridProps, "weekdayStyle"> { 19 20 errorMessage?: string; 20 21 }

+3 -2

packages/hip-ui/src/components/time-field/index.tsx

reviewed

··· 81 81 ); 82 82 } 83 83 84 84 - export interface TimeFieldProps<T extends TimeValue> 85 85 - extends StyleXComponentProps<Omit<AriaTimeFieldProps<T>, "isInvalid">> { 84 84 + export interface TimeFieldProps< 85 85 + T extends TimeValue, 86 86 + > extends StyleXComponentProps<Omit<AriaTimeFieldProps<T>, "isInvalid">> { 86 87 label?: React.ReactNode; 87 88 description?: string; 88 89 errorMessage?: string | ((validation: ValidationResult) => string);

+3 -4

packages/hip-ui/src/components/toast/Toast.tsx

reviewed

··· 163 163 ); 164 164 } 165 165 166 166 - export interface ToastRegionProps 167 167 - extends StyleXComponentProps< 168 168 - Omit<AriaToastRegionProps<ToastContentType>, "children" | "queue"> 169 169 - > {} 166 166 + export interface ToastRegionProps extends StyleXComponentProps< 167 167 + Omit<AriaToastRegionProps<ToastContentType>, "children" | "queue"> 168 168 + > {} 170 169 171 170 export function ToastRegion({ style, ...props }: ToastRegionProps) { 172 171 return (

+3 -2

packages/hip-ui/src/components/toggle-button-group/index.tsx

reviewed

··· 50 50 }), 51 51 }); 52 52 53 53 - interface ToggleButtonGroupBaseProps 54 54 - extends StyleXComponentProps<Omit<AriaToggleButtonGroupProps, "children">> { 53 53 + interface ToggleButtonGroupBaseProps extends StyleXComponentProps< 54 54 + Omit<AriaToggleButtonGroupProps, "children"> 55 55 + > { 55 56 orientation?: "horizontal" | "vertical"; 56 57 children?: React.ReactNode; 57 58 }

+3 -2

packages/hip-ui/src/components/toggle-button/index.tsx

reviewed

··· 91 91 }, 92 92 }); 93 93 94 94 - export interface ToggleButtonProps 95 95 - extends StyleXComponentProps<Omit<AriaToggleButtonProps, "children">> { 94 94 + export interface ToggleButtonProps extends StyleXComponentProps< 95 95 + Omit<AriaToggleButtonProps, "children"> 96 96 + > { 96 97 variant?: Exclude<ButtonVariant, "critical" | "critical-outline">; 97 98 size?: Size; 98 99 children?: React.ReactNode;

+3 -2

packages/hip-ui/src/components/toolbar/index.tsx

reviewed

··· 90 90 return <Group {...props} {...stylex.props(styles.group, style)} />; 91 91 } 92 92 93 93 - export interface ToolbarSeparatorProps 94 94 - extends StyleXComponentProps<Omit<AriaSeparatorProps, "orientation">> {} 93 93 + export interface ToolbarSeparatorProps extends StyleXComponentProps< 94 94 + Omit<AriaSeparatorProps, "orientation"> 95 95 + > {} 95 96 96 97 export function ToolbarSeparator({ style, ...props }: ToolbarSeparatorProps) { 97 98 return (

+2 -1

packages/hip-ui/src/components/tooltip/index.tsx

reviewed

··· 69 69 }); 70 70 71 71 interface TooltipProps 72 72 - extends TooltipTriggerComponentProps, 72 72 + extends 73 73 + TooltipTriggerComponentProps, 73 74 Pick<AriaTooltipProps, "crossOffset" | "placement" | "shouldFlip"> { 74 75 text: string; 75 76 children: React.ReactNode;

+9 -7

packages/hip-ui/src/components/tree/index.tsx

reviewed

··· 103 103 }, 104 104 }); 105 105 106 106 - interface TreeItemContentProps 107 107 - extends Omit<AriaTreeItemContentProps, "children"> { 106 106 + interface TreeItemContentProps extends Omit< 107 107 + AriaTreeItemContentProps, 108 108 + "children" 109 109 + > { 108 110 children?: React.ReactNode; 109 111 prefix?: React.ReactNode; 110 112 suffix?: React.ReactNode; ··· 175 177 } 176 178 177 179 interface TreeItemBaseProps<T extends object> 178 178 - extends StyleXComponentProps< 179 179 - Omit<AriaTreeItemProps<T>, "textValue" | "children"> 180 180 - >, 180 180 + extends 181 181 + StyleXComponentProps<Omit<AriaTreeItemProps<T>, "textValue" | "children">>, 181 182 Pick<TreeItemContentProps, "prefix" | "suffix"> { 182 183 children?: React.ReactNode; 183 184 } ··· 226 227 ); 227 228 } 228 229 229 229 - export interface TreeProps<T extends object> 230 230 - extends StyleXComponentProps<Omit<AriaTreeProps<T>, "children">> { 230 230 + export interface TreeProps<T extends object> extends StyleXComponentProps< 231 231 + Omit<AriaTreeProps<T>, "children"> 232 232 + > { 231 233 children: React.ReactNode | ((item: T) => React.ReactNode); 232 234 size?: Size; 233 235 isVirtualized?: boolean;

+42 -28

packages/hip-ui/src/components/typography/index.tsx

reviewed

··· 74 74 }, 75 75 }); 76 76 77 77 - export interface Heading1Props 78 78 - extends StyleXComponentProps<React.ComponentProps<"h1">> {} 77 77 + export interface Heading1Props extends StyleXComponentProps< 78 78 + React.ComponentProps<"h1"> 79 79 + > {} 79 80 80 81 export const Heading1 = ({ style, ...props }: Heading1Props) => { 81 82 // eslint-disable-next-line jsx-a11y/heading-has-content 82 83 return <h1 {...props} {...stylex.props(typeramp.heading1, style)} />; 83 84 }; 84 85 85 85 - export interface Heading2Props 86 86 - extends StyleXComponentProps<React.ComponentProps<"h2">> {} 86 86 + export interface Heading2Props extends StyleXComponentProps< 87 87 + React.ComponentProps<"h2"> 88 88 + > {} 87 89 88 90 export const Heading2 = ({ style, ...props }: Heading2Props) => { 89 91 // eslint-disable-next-line jsx-a11y/heading-has-content 90 92 return <h2 {...props} {...stylex.props(typeramp.heading2, style)} />; 91 93 }; 92 94 93 93 - export interface Heading3Props 94 94 - extends StyleXComponentProps<React.ComponentProps<"h3">> {} 95 95 + export interface Heading3Props extends StyleXComponentProps< 96 96 + React.ComponentProps<"h3"> 97 97 + > {} 95 98 96 99 export const Heading3 = ({ style, ...props }: Heading3Props) => { 97 100 // eslint-disable-next-line jsx-a11y/heading-has-content 98 101 return <h3 {...props} {...stylex.props(typeramp.heading3, style)} />; 99 102 }; 100 103 101 101 - export interface Heading4Props 102 102 - extends StyleXComponentProps<React.ComponentProps<"h4">> {} 104 104 + export interface Heading4Props extends StyleXComponentProps< 105 105 + React.ComponentProps<"h4"> 106 106 + > {} 103 107 104 108 export const Heading4 = ({ style, ...props }: Heading4Props) => { 105 109 // eslint-disable-next-line jsx-a11y/heading-has-content 106 110 return <h4 {...props} {...stylex.props(typeramp.heading4, style)} />; 107 111 }; 108 112 109 109 - export interface Heading5Props 110 110 - extends StyleXComponentProps<React.ComponentProps<"h5">> {} 113 113 + export interface Heading5Props extends StyleXComponentProps< 114 114 + React.ComponentProps<"h5"> 115 115 + > {} 111 116 112 117 export const Heading5 = ({ style, ...props }: Heading5Props) => { 113 118 // eslint-disable-next-line jsx-a11y/heading-has-content 114 119 return <h5 {...props} {...stylex.props(typeramp.heading5, style)} />; 115 120 }; 116 121 117 117 - export interface BodyProps 118 118 - extends StyleXComponentProps<React.ComponentProps<"p">> { 122 122 + export interface BodyProps extends StyleXComponentProps< 123 123 + React.ComponentProps<"p"> 124 124 + > { 119 125 variant?: TextVariant; 120 126 } 121 127 ··· 146 152 ); 147 153 }; 148 154 149 149 - export interface SmallBodyProps 150 150 - extends StyleXComponentProps<React.ComponentProps<"p">> { 155 155 + export interface SmallBodyProps extends StyleXComponentProps< 156 156 + React.ComponentProps<"p"> 157 157 + > { 151 158 variant?: TextVariant; 152 159 } 153 160 ··· 182 189 ); 183 190 }; 184 191 185 185 - interface LabelTextProps 186 186 - extends StyleXComponentProps<React.ComponentProps<"p">> { 192 192 + interface LabelTextProps extends StyleXComponentProps< 193 193 + React.ComponentProps<"p"> 194 194 + > { 187 195 variant?: TextVariant; 188 196 hasEllipsis?: boolean; 189 197 } ··· 208 216 ); 209 217 }; 210 218 211 211 - interface SubLabelProps 212 212 - extends StyleXComponentProps<React.ComponentProps<"p">> { 219 219 + interface SubLabelProps extends StyleXComponentProps< 220 220 + React.ComponentProps<"p"> 221 221 + > { 213 222 variant?: TextVariant; 214 223 } 215 224 ··· 244 253 ); 245 254 }; 246 255 247 247 - export interface BlockquoteProps 248 248 - extends StyleXComponentProps<React.ComponentProps<"blockquote">> {} 256 256 + export interface BlockquoteProps extends StyleXComponentProps< 257 257 + React.ComponentProps<"blockquote"> 258 258 + > {} 249 259 250 260 export const Blockquote = ({ style, ...props }: BlockquoteProps) => { 251 261 return <blockquote {...props} {...stylex.props(styles.blockquote, style)} />; 252 262 }; 253 263 254 254 - export interface UnorderedListProps 255 255 - extends StyleXComponentProps<React.ComponentProps<"ul">> {} 264 264 + export interface UnorderedListProps extends StyleXComponentProps< 265 265 + React.ComponentProps<"ul"> 266 266 + > {} 256 267 257 268 export const UnorderedList = ({ style, ...props }: UnorderedListProps) => { 258 269 return <ul {...props} {...stylex.props(styles.unorderedList, style)} />; 259 270 }; 260 271 261 261 - export interface OrderedListProps 262 262 - extends StyleXComponentProps<React.ComponentProps<"ol">> {} 272 272 + export interface OrderedListProps extends StyleXComponentProps< 273 273 + React.ComponentProps<"ol"> 274 274 + > {} 263 275 264 276 export const OrderedList = ({ style, ...props }: OrderedListProps) => { 265 277 return <ol {...props} {...stylex.props(styles.orderedList, style)} />; 266 278 }; 267 279 268 268 - export interface ListItemProps 269 269 - extends StyleXComponentProps<React.ComponentProps<"li">> {} 280 280 + export interface ListItemProps extends StyleXComponentProps< 281 281 + React.ComponentProps<"li"> 282 282 + > {} 270 283 271 284 export const ListItem = ({ style, children, ...props }: ListItemProps) => { 272 285 return ( ··· 276 289 ); 277 290 }; 278 291 279 279 - export interface InlineCodeProps 280 280 - extends StyleXComponentProps<React.ComponentProps<"code">> {} 292 292 + export interface InlineCodeProps extends StyleXComponentProps< 293 293 + React.ComponentProps<"code"> 294 294 + > {} 281 295 282 296 export const InlineCode = ({ style, ...props }: InlineCodeProps) => { 283 297 return (

+4 -2

packages/hip-ui/src/components/typography/text.tsx

reviewed

··· 72 72 }, 73 73 }); 74 74 75 75 - interface TextProps 76 76 - extends Omit<React.ComponentProps<"span">, "style" | "className"> { 75 75 + interface TextProps extends Omit< 76 76 + React.ComponentProps<"span">, 77 77 + "style" | "className" 78 78 + > { 77 79 style?: stylex.StyleXStyles | stylex.StyleXStyles[]; 78 80 font?: ThemeKeys<typeof fontFamily>; 79 81 weight?: ThemeKeys<typeof fontWeight>;

+3 -6

packages/hip-ui/src/components/window-splitter/index.tsx

reviewed

··· 57 57 }, 58 58 }); 59 59 60 60 - export interface WindowSplitterPanelGroupProps 61 61 - extends StyleXComponentProps<PanelGroupProps> {} 60 60 + export interface WindowSplitterPanelGroupProps extends StyleXComponentProps<PanelGroupProps> {} 62 61 63 63 - export interface WindowSplitterPanelProps 64 64 - extends StyleXComponentProps<PanelProps> {} 62 62 + export interface WindowSplitterPanelProps extends StyleXComponentProps<PanelProps> {} 65 63 66 66 - export interface WindowSplitterPanelResizerProps 67 67 - extends StyleXComponentProps<PanelResizerProps> {} 64 64 + export interface WindowSplitterPanelResizerProps extends StyleXComponentProps<PanelResizerProps> {} 68 65 69 66 export function PanelGroup({ style, ...props }: WindowSplitterPanelGroupProps) { 70 67 return <BasePanelGroup {...props} {...stylex.props(style)} />;

+10 -2

pnpm-lock.yaml

reviewed

··· 66 66 .: 67 67 devDependencies: 68 68 prettier: 69 69 - specifier: ^3.6.2 70 70 - version: 3.6.2 69 69 + specifier: ^3.7.4 70 70 + version: 3.7.4 71 71 turbo: 72 72 specifier: ^2.5.8 73 73 version: 2.5.8 ··· 6347 6347 engines: {node: '>=14'} 6348 6348 hasBin: true 6349 6349 6350 6350 + prettier@3.7.4: 6351 6351 + resolution: {integrity: sha512-v6UNi1+3hSlVvv8fSaoUbggEM5VErKmmpGA7Pl3HF8V6uKY7rvClBOJlH6yNwQtfTueNkGVpOv/mtWL9L4bgRA==} 6352 6352 + engines: {node: '>=14'} 6353 6353 + hasBin: true 6354 6354 + 6350 6355 pretty-bytes@7.1.0: 6351 6356 resolution: {integrity: sha512-nODzvTiYVRGRqAOvE84Vk5JDPyyxsVk0/fbA/bq7RqlnhksGpset09XTxbpvLTIjoaF7K8Z8DG8yHtKGTPSYRw==} 6352 6357 engines: {node: '>=20'} ··· 6534 6539 react-server-dom-webpack@19.2.0: 6535 6540 resolution: {integrity: sha512-ar2H1q9SvonShYYYszHx7gE3v9NF3K01AvrIvQMIRNXj+CiUDjI2C7XKexDSlOzqwSlxgDivaMdYwfEBYD6NjQ==} 6536 6541 engines: {node: '>=0.10.0'} 6542 6542 + deprecated: Critical Security Vulnerability in React Server Components 6537 6543 peerDependencies: 6538 6544 react: ^19.2.0 6539 6545 react-dom: ^19.2.0 ··· 15150 15156 prelude-ls@1.2.1: {} 15151 15157 15152 15158 prettier@3.6.2: {} 15159 15159 + 15160 15160 + prettier@3.7.4: {} 15153 15161 15154 15162 pretty-bytes@7.1.0: {} 15155 15163