From 85f9fa13f818703bce1100ad706a66d703c0b0ba Mon Sep 17 00:00:00 2001 From: Tasso Evangelista Date: Fri, 8 Jan 2021 19:09:33 -0300 Subject: [PATCH] fix: Update Fuselage typings (#355) --- packages/fuselage/fuselage.d.ts | 733 +++++++++++++++++--------------- 1 file changed, 395 insertions(+), 338 deletions(-) diff --git a/packages/fuselage/fuselage.d.ts b/packages/fuselage/fuselage.d.ts index 2ed023ee04..f97c8ae362 100644 --- a/packages/fuselage/fuselage.d.ts +++ b/packages/fuselage/fuselage.d.ts @@ -1,346 +1,403 @@ declare module '@rocket.chat/fuselage' { import type { css } from '@rocket.chat/css-in-js'; - - import { - AllHTMLAttributes, - Context, - CSSProperties, - Dispatch, - ElementType, - ForwardRefExoticComponent, - PropsWithChildren, - ReactNode, - RefAttributes, - SetStateAction, - SVGAttributes, - } from 'react'; - - type FontScale = 'h1' | 's1' | 's2' | 'p1' | 'p2' | 'c1' | 'c2' | 'micro'; - - type BoxProps = PropsWithChildren<{ - is?: ElementType; - className?: string | ReturnType | (string | ReturnType)[]; - style?: CSSProperties; - border?: CSSProperties['border']; - borderBlock?: CSSProperties['borderBlock']; - borderBlockStart?: CSSProperties['borderBlockStart']; - borderBlockEnd?: CSSProperties['borderBlockEnd']; - borderInline?: CSSProperties['borderInline']; - borderInlineStart?: CSSProperties['borderInlineStart']; - borderInlineEnd?: CSSProperties['borderInlineEnd']; - borderWidth?: CSSProperties['borderWidth']; - borderBlockWidth?: CSSProperties['borderBlockWidth']; - borderBlockStartWidth?: CSSProperties['borderBlockStartWidth']; - borderBlockEndWidth?: CSSProperties['borderBlockEndWidth']; - borderInlineWidth?: CSSProperties['borderInlineWidth']; - borderInlineStartWidth?: CSSProperties['borderInlineStartWidth']; - borderInlineEndWidth?: CSSProperties['borderInlineEndWidth']; - borderStyle?: CSSProperties['borderStyle']; - borderBlockStyle?: CSSProperties['borderBlockStyle']; - borderBlockStartStyle?: CSSProperties['borderBlockStartStyle']; - borderBlockEndStyle?: CSSProperties['borderBlockEndStyle']; - borderInlineStyle?: CSSProperties['borderInlineStyle']; - borderInlineStartStyle?: CSSProperties['borderInlineStartStyle']; - borderInlineEndStyle?: CSSProperties['borderInlineEndStyle']; - borderColor?: CSSProperties['borderColor']; - borderBlockColor?: CSSProperties['borderBlockColor']; - borderBlockStartColor?: CSSProperties['borderBlockStartColor']; - borderBlockEndColor?: CSSProperties['borderBlockEndColor']; - borderInlineColor?: CSSProperties['borderInlineColor']; - borderInlineStartColor?: CSSProperties['borderInlineStartColor']; - borderInlineEndColor?: CSSProperties['borderInlineEndColor']; - borderRadius?: CSSProperties['borderRadius']; - borderStartStartRadius?: CSSProperties['borderStartStartRadius']; - borderStartEndRadius?: CSSProperties['borderStartEndRadius']; - borderEndStartRadius?: CSSProperties['borderEndStartRadius']; - borderEndEndRadius?: CSSProperties['borderEndEndRadius']; - - color?: CSSProperties['color']; - backgroundColor?: CSSProperties['backgroundColor']; - bg?: CSSProperties['backgroundColor']; - opacity?: CSSProperties['opacity']; - - alignItems?: CSSProperties['alignItems']; - alignContent?: CSSProperties['alignContent']; - justifyItems?: CSSProperties['justifyItems']; - justifyContent?: CSSProperties['justifyContent']; - flexWrap?: CSSProperties['flexWrap']; - flexDirection?: CSSProperties['flexDirection']; - flexGrow?: CSSProperties['flexGrow']; - flexShrink?: CSSProperties['flexShrink']; - flexBasis?: CSSProperties['flexBasis']; - justifySelf?: CSSProperties['justifySelf']; - alignSelf?: CSSProperties['alignSelf']; - order?: CSSProperties['order']; - - w?: CSSProperties['width']; - width?: CSSProperties['width']; - minWidth?: CSSProperties['minWidth']; - maxWidth?: CSSProperties['maxWidth']; - h?: CSSProperties['height']; - height?: CSSProperties['height']; - minHeight?: CSSProperties['minHeight']; - maxHeight?: CSSProperties['maxHeight']; - display?: CSSProperties['display']; - verticalAlign?: CSSProperties['verticalAlign']; - overflow?: CSSProperties['overflow']; - overflowX?: CSSProperties['overflowX']; - overflowY?: CSSProperties['overflowY']; - - position?: CSSProperties['position']; - zIndex?: CSSProperties['zIndex']; - inset?: CSSProperties['inset']; - insetBlock?: CSSProperties['insetBlock']; - insetBlockStart?: CSSProperties['insetBlockStart']; - insetBlockEnd?: CSSProperties['insetBlockEnd']; - insetInline?: CSSProperties['insetInline']; - insetInlineStart?: CSSProperties['insetInlineStart']; - insetInlineEnd?: CSSProperties['insetInlineEnd']; - - m?: CSSProperties['margin']; - margin?: CSSProperties['margin']; - mb?: CSSProperties['marginBlock']; - marginBlock?: CSSProperties['marginBlock']; - mbs?: CSSProperties['marginBlockStart']; - marginBlockStart?: CSSProperties['marginBlockStart']; - mbe?: CSSProperties['marginBlockEnd']; - marginBlockEnd?: CSSProperties['marginBlockEnd']; - mi?: CSSProperties['marginInline']; - marginInline?: CSSProperties['marginInline']; - mis?: CSSProperties['marginInlineStart']; - marginInlineStart?: CSSProperties['marginInlineStart']; - mie?: CSSProperties['marginInlineEnd']; - marginInlineEnd?: CSSProperties['marginInlineEnd']; - p?: CSSProperties['padding']; - padding?: CSSProperties['padding']; - pb?: CSSProperties['paddingBlock']; - paddingBlock?: CSSProperties['paddingBlock']; - pbs?: CSSProperties['paddingBlockStart']; - paddingBlockStart?: CSSProperties['paddingBlockStart']; - pbe?: CSSProperties['paddingBlockEnd']; - paddingBlockEnd?: CSSProperties['paddingBlockEnd']; - pi?: CSSProperties['paddingInline']; - paddingInline?: CSSProperties['paddingInline']; - pis?: CSSProperties['paddingInlineStart']; - paddingInlineStart?: CSSProperties['paddingInlineStart']; - pie?: CSSProperties['paddingInlineEnd']; - paddingInlineEnd?: CSSProperties['paddingInlineEnd']; - - fontFamily?: CSSProperties['fontFamily'] | FontScale; - fontSize?: CSSProperties['fontSize'] | FontScale; - fontStyle?: CSSProperties['fontStyle']; - fontWeight?: CSSProperties['fontWeight'] | FontScale; - letterSpacing?: CSSProperties['letterSpacing'] | FontScale; - lineHeight?: CSSProperties['lineHeight'] | FontScale; - textAlign?: CSSProperties['textAlign']; - textTransform?: CSSProperties['textTransform']; - textDecorationLine?: CSSProperties['textDecorationLine']; - - elevation?: '0' | '1' | '2'; - invisible?: boolean; - withRichContent?: boolean; - withTruncatedText?: boolean; - size?: CSSProperties['blockSize']; - minSize?: CSSProperties['blockSize']; - maxSize?: CSSProperties['blockSize']; - fontScale?: FontScale; - }> - & Omit, 'className'> - & Omit, keyof AllHTMLAttributes> - & RefAttributes; - - export const Box: ForwardRefExoticComponent; - - type AccordionProps = BoxProps; - type AccordionItemProps = Omit & { - defaultExpanded?: boolean; - title?: string; - }; - export const Accordion: ForwardRefExoticComponent & { - Item: ForwardRefExoticComponent; - }; - - type AvatarProps = BoxProps; - export const Avatar: ForwardRefExoticComponent & { - Context: Context<{ - baseUrl: string; - }>; - }; - - type ButtonProps = BoxProps & { - primary?: boolean; - ghost?: boolean; - danger?: boolean; - small?: boolean; - square?: boolean; - }; - export const Button: ForwardRefExoticComponent; - - type ButtonGroupProps = BoxProps & { - align?: 'start' | 'center' | 'end'; - stretch?: boolean; - wrap?: boolean; - vertical?: boolean; - }; - export const ButtonGroup: ForwardRefExoticComponent; - - type CalloutProps = BoxProps; - export const Callout: ForwardRefExoticComponent; - - type CheckBoxProps = BoxProps & { - indeterminate?: boolean; - }; - export const CheckBox: ForwardRefExoticComponent; - - type ChevronProps = Omit & { - size?: BoxProps['width']; - right?: boolean; - left?: boolean; - top?: boolean; - bottom?: boolean; - }; - export const Chevron: ForwardRefExoticComponent; - - type ChipProps = BoxProps; - export const Chip: ForwardRefExoticComponent; - - type FieldProps = BoxProps; - export const Field: ForwardRefExoticComponent & { - Row: ForwardRefExoticComponent; - Label: ForwardRefExoticComponent; - Hint: ForwardRefExoticComponent; - Error: ForwardRefExoticComponent; - }; - - type FieldGroupProps = BoxProps; - export const FieldGroup: ForwardRefExoticComponent; - - type IconProps = Omit & { - size?: BoxProps['width']; - }; - export const Icon: ForwardRefExoticComponent; - - type InputBoxProps = BoxProps; - type InputBoxSkeletonProps = BoxProps; - export const InputBox: ForwardRefExoticComponent & { - Skeleton: ForwardRefExoticComponent; - }; - - type ModalProps = BoxProps; - type ModalBackdropProps = BoxProps; - type ModalCloseProps = BoxProps; - type ModalContentProps = BoxProps; - type ModalFooterProps = BoxProps; + import { Placements } from '@rocket.chat/fuselage-hooks'; + import { + AllHTMLAttributes, + Context, + CSSProperties, + Dispatch, + ElementType, + FC, + ForwardRefExoticComponent, + PropsWithChildren, + ReactNode, + RefAttributes, + SetStateAction, + SVGAttributes, + } from 'react'; + + type FontScale = 'h1' | 's1' | 's2' | 'p1' | 'p2' | 'c1' | 'c2' | 'micro'; + + type BoxProps = PropsWithChildren<{ + is?: ElementType; + className?: string | ReturnType | (string | ReturnType)[]; + style?: CSSProperties; + border?: CSSProperties['border']; + borderBlock?: CSSProperties['borderBlock']; + borderBlockStart?: CSSProperties['borderBlockStart']; + borderBlockEnd?: CSSProperties['borderBlockEnd']; + borderInline?: CSSProperties['borderInline']; + borderInlineStart?: CSSProperties['borderInlineStart']; + borderInlineEnd?: CSSProperties['borderInlineEnd']; + borderWidth?: CSSProperties['borderWidth']; + borderBlockWidth?: CSSProperties['borderBlockWidth']; + borderBlockStartWidth?: CSSProperties['borderBlockStartWidth']; + borderBlockEndWidth?: CSSProperties['borderBlockEndWidth']; + borderInlineWidth?: CSSProperties['borderInlineWidth']; + borderInlineStartWidth?: CSSProperties['borderInlineStartWidth']; + borderInlineEndWidth?: CSSProperties['borderInlineEndWidth']; + borderStyle?: CSSProperties['borderStyle']; + borderBlockStyle?: CSSProperties['borderBlockStyle']; + borderBlockStartStyle?: CSSProperties['borderBlockStartStyle']; + borderBlockEndStyle?: CSSProperties['borderBlockEndStyle']; + borderInlineStyle?: CSSProperties['borderInlineStyle']; + borderInlineStartStyle?: CSSProperties['borderInlineStartStyle']; + borderInlineEndStyle?: CSSProperties['borderInlineEndStyle']; + borderColor?: CSSProperties['borderColor']; + borderBlockColor?: CSSProperties['borderBlockColor']; + borderBlockStartColor?: CSSProperties['borderBlockStartColor']; + borderBlockEndColor?: CSSProperties['borderBlockEndColor']; + borderInlineColor?: CSSProperties['borderInlineColor']; + borderInlineStartColor?: CSSProperties['borderInlineStartColor']; + borderInlineEndColor?: CSSProperties['borderInlineEndColor']; + borderRadius?: CSSProperties['borderRadius']; + borderStartStartRadius?: CSSProperties['borderStartStartRadius']; + borderStartEndRadius?: CSSProperties['borderStartEndRadius']; + borderEndStartRadius?: CSSProperties['borderEndStartRadius']; + borderEndEndRadius?: CSSProperties['borderEndEndRadius']; + + color?: CSSProperties['color']; + backgroundColor?: CSSProperties['backgroundColor']; + bg?: CSSProperties['backgroundColor']; + opacity?: CSSProperties['opacity']; + + alignItems?: CSSProperties['alignItems']; + alignContent?: CSSProperties['alignContent']; + justifyItems?: CSSProperties['justifyItems']; + justifyContent?: CSSProperties['justifyContent']; + flexWrap?: CSSProperties['flexWrap']; + flexDirection?: CSSProperties['flexDirection']; + flexGrow?: CSSProperties['flexGrow']; + flexShrink?: CSSProperties['flexShrink']; + flexBasis?: CSSProperties['flexBasis']; + justifySelf?: CSSProperties['justifySelf']; + alignSelf?: CSSProperties['alignSelf']; + order?: CSSProperties['order']; + + w?: CSSProperties['width']; + width?: CSSProperties['width']; + minWidth?: CSSProperties['minWidth']; + maxWidth?: CSSProperties['maxWidth']; + h?: CSSProperties['height']; + height?: CSSProperties['height']; + minHeight?: CSSProperties['minHeight']; + maxHeight?: CSSProperties['maxHeight']; + display?: CSSProperties['display']; + verticalAlign?: CSSProperties['verticalAlign']; + overflow?: CSSProperties['overflow']; + overflowX?: CSSProperties['overflowX']; + overflowY?: CSSProperties['overflowY']; + + position?: CSSProperties['position']; + zIndex?: CSSProperties['zIndex']; + inset?: CSSProperties['inset']; + insetBlock?: CSSProperties['insetBlock']; + insetBlockStart?: CSSProperties['insetBlockStart']; + insetBlockEnd?: CSSProperties['insetBlockEnd']; + insetInline?: CSSProperties['insetInline']; + insetInlineStart?: CSSProperties['insetInlineStart']; + insetInlineEnd?: CSSProperties['insetInlineEnd']; + + m?: CSSProperties['margin']; + margin?: CSSProperties['margin']; + mb?: CSSProperties['marginBlock']; + marginBlock?: CSSProperties['marginBlock']; + mbs?: CSSProperties['marginBlockStart']; + marginBlockStart?: CSSProperties['marginBlockStart']; + mbe?: CSSProperties['marginBlockEnd']; + marginBlockEnd?: CSSProperties['marginBlockEnd']; + mi?: CSSProperties['marginInline']; + marginInline?: CSSProperties['marginInline']; + mis?: CSSProperties['marginInlineStart']; + marginInlineStart?: CSSProperties['marginInlineStart']; + mie?: CSSProperties['marginInlineEnd']; + marginInlineEnd?: CSSProperties['marginInlineEnd']; + p?: CSSProperties['padding']; + padding?: CSSProperties['padding']; + pb?: CSSProperties['paddingBlock']; + paddingBlock?: CSSProperties['paddingBlock']; + pbs?: CSSProperties['paddingBlockStart']; + paddingBlockStart?: CSSProperties['paddingBlockStart']; + pbe?: CSSProperties['paddingBlockEnd']; + paddingBlockEnd?: CSSProperties['paddingBlockEnd']; + pi?: CSSProperties['paddingInline']; + paddingInline?: CSSProperties['paddingInline']; + pis?: CSSProperties['paddingInlineStart']; + paddingInlineStart?: CSSProperties['paddingInlineStart']; + pie?: CSSProperties['paddingInlineEnd']; + paddingInlineEnd?: CSSProperties['paddingInlineEnd']; + + fontFamily?: CSSProperties['fontFamily'] | FontScale; + fontSize?: CSSProperties['fontSize'] | FontScale; + fontStyle?: CSSProperties['fontStyle']; + fontWeight?: CSSProperties['fontWeight'] | FontScale; + letterSpacing?: CSSProperties['letterSpacing'] | FontScale; + lineHeight?: CSSProperties['lineHeight'] | FontScale; + textAlign?: CSSProperties['textAlign']; + textTransform?: CSSProperties['textTransform']; + textDecorationLine?: CSSProperties['textDecorationLine']; + + elevation?: '0' | '1' | '2'; + invisible?: boolean; + withRichContent?: boolean; + withTruncatedText?: boolean; + size?: CSSProperties['blockSize']; + minSize?: CSSProperties['blockSize']; + maxSize?: CSSProperties['blockSize']; + fontScale?: FontScale; + }> + & Omit, 'className'> + & Omit, keyof AllHTMLAttributes> + & RefAttributes; + + export const Box: ForwardRefExoticComponent; + + type AccordionProps = BoxProps; + type AccordionItemProps = Omit & { + defaultExpanded?: boolean; + title?: string; + }; + export const Accordion: ForwardRefExoticComponent & { + Item: ForwardRefExoticComponent; + }; + + type ActionButtonProps = ButtonProps & { + icon: string; + mini?: boolean; + tiny?: boolean; + }; + export const ActionButton: ForwardRefExoticComponent; + + type AvatarProps = BoxProps; + export const Avatar: ForwardRefExoticComponent & { + Context: Context<{ + baseUrl: string; + }>; + }; + + type BadgeProps = { + is?: ElementType; + variant?: 'primary' | 'danger' | 'warning'; + disabled?: boolean; + className?: string; + children?: any; + title?: any; + } + export const Badge: ForwardRefExoticComponent; + + type ButtonProps = BoxProps & { + primary?: boolean; + ghost?: boolean; + danger?: boolean; + small?: boolean; + square?: boolean; + }; + export const Button: ForwardRefExoticComponent; + + type ButtonGroupProps = BoxProps & { + align?: 'start' | 'center' | 'end'; + stretch?: boolean; + wrap?: boolean; + vertical?: boolean; + small?: boolean; + medium?: boolean; + }; + export const ButtonGroup: ForwardRefExoticComponent; + + type CalloutProps = BoxProps; + export const Callout: ForwardRefExoticComponent; + + type CheckBoxProps = BoxProps & { + indeterminate?: boolean; + }; + export const CheckBox: ForwardRefExoticComponent; + + type ChevronProps = Omit & { + size?: BoxProps['width']; + right?: boolean; + left?: boolean; + top?: boolean; + bottom?: boolean; + }; + export const Chevron: ForwardRefExoticComponent; + + type ChipProps = BoxProps; + export const Chip: ForwardRefExoticComponent; + + type DividerProps = BoxProps; + export const Divider: ForwardRefExoticComponent; + + type FieldProps = BoxProps; + export const Field: ForwardRefExoticComponent & { + Row: ForwardRefExoticComponent; + Label: ForwardRefExoticComponent; + Hint: ForwardRefExoticComponent; + Error: ForwardRefExoticComponent; + }; + + type FieldGroupProps = BoxProps; + export const FieldGroup: ForwardRefExoticComponent; + + type IconProps = Omit & { + size?: BoxProps['width']; + }; + export const Icon: ForwardRefExoticComponent; + + type InputBoxProps = BoxProps; + type InputBoxSkeletonProps = BoxProps; + export const InputBox: ForwardRefExoticComponent & { + Skeleton: ForwardRefExoticComponent; + }; + + export type MenuProps = Omit & { + icon?: string; + options: { + [id: string]: { + label: { + title: string; + icon: string; + }; + action: Function; + }; + }; + optionWidth?: BoxProps['width']; + placement?: Placements; + renderItem?: (props: OptionProps) => ReactNode; + } + export const Menu: ForwardRefExoticComponent; + + type ModalProps = BoxProps; + type ModalBackdropProps = BoxProps; + type ModalCloseProps = BoxProps; + type ModalContentProps = BoxProps; + type ModalFooterProps = BoxProps; type ModalHeaderProps = BoxProps; type ModalThumbProps = BoxProps; - type ModalTitleProps = BoxProps; - export const Modal: ForwardRefExoticComponent & { + type ModalTitleProps = BoxProps; + export const Modal: ForwardRefExoticComponent & { Backdrop: ForwardRefExoticComponent; - Close: ForwardRefExoticComponent; - Content: ForwardRefExoticComponent; - Footer: ForwardRefExoticComponent; + Close: ForwardRefExoticComponent; + Content: ForwardRefExoticComponent; + Footer: ForwardRefExoticComponent; Header: ForwardRefExoticComponent; Thumb: ForwardRefExoticComponent; - Title: ForwardRefExoticComponent; - }; - - type NumberInputProps = BoxProps; - export const NumberInput: ForwardRefExoticComponent; - - type PaginationProps = BoxProps & { - count: number; - current?: number; - itemsPerPage?: 25 | 50 | 100; - itemsPerPageLabel?: () => string; - showingResultsLabel?: (props: { count: number; current: number; itemsPerPage: 25 | 50 | 100 }) => string; - onSetCurrent?: Dispatch>; - onSetItemsPerPage?: Dispatch>; - }; - export const Pagination: ForwardRefExoticComponent; - - type PasswordInputProps = BoxProps & { - error?: string; - }; - export const PasswordInput: ForwardRefExoticComponent; - - type SearchInputProps = BoxProps & { - addon?: ReactNode; - error?: string; - }; - export const SearchInput: ForwardRefExoticComponent; - - type SkeletonProps = BoxProps & { - variant?: 'rect'; - }; - export const Skeleton: ForwardRefExoticComponent; - - type TableProps = BoxProps; - type TableHeadProps = BoxProps; - type TableBodyProps = BoxProps; - type TableRowProps = Omit & { - action?: boolean; - }; - type TableCellProps = BoxProps & { - align?: 'start' | 'center' | 'end'; - clickable?: boolean; - }; - export const Table: ForwardRefExoticComponent & { - Head: ForwardRefExoticComponent; - Body: ForwardRefExoticComponent; - Row: ForwardRefExoticComponent; - Cell: ForwardRefExoticComponent; - }; - - type TagProps = BoxProps & { - variant?: 'secondary' | 'primary' | 'danger'; - }; - export const Tag: ForwardRefExoticComponent; - - type TextAreaInputProps = BoxProps; - export const TextAreaInput: ForwardRefExoticComponent; - - type TextInputProps = BoxProps & { - addon?: ReactNode; - error?: string; - }; - export const TextInput: ForwardRefExoticComponent; - - type TileProps = BoxProps; - export const Tile: ForwardRefExoticComponent; - - type ThrobberProps = Omit & { - size?: BoxProps['width']; - inheritColor?: boolean; - }; - export const Throbber: ForwardRefExoticComponent; - - type ToggleSwitchProps = BoxProps; - export const ToggleSwitch: ForwardRefExoticComponent; - - type MarginsProps = PropsWithChildren<{ - all?: BoxProps['margin']; - block?: BoxProps['marginBlock']; - blockStart?: BoxProps['marginBlockStart']; - blockEnd?: BoxProps['marginBlockEnd']; - inline?: BoxProps['marginInline']; - inlineStart?: BoxProps['marginInlineStart']; - inlineEnd?: BoxProps['marginInlineEnd']; - }>; - export const Margins: ForwardRefExoticComponent; - - type ScrollableProps = PropsWithChildren<{ - horizontal?: boolean; - vertical?: boolean; - onScrollContent?: (touching: { top: boolean }) => void; - }>; - export const Scrollable: ForwardRefExoticComponent; - - type SelectOptions = [string, string][]; - type SelectProps = BoxProps & { - error?: string; - options: SelectOptions; - }; - export const Select: ForwardRefExoticComponent; - - export const Divider: ForwardRefExoticComponent; + Title: ForwardRefExoticComponent; + }; + + type NumberInputProps = BoxProps; + export const NumberInput: ForwardRefExoticComponent; + + type OptionProps = { + id?: string; + avatar?: typeof Avatar; // eslint-disable-line no-undef + label?: string; + focus?: boolean; + selected?: boolean; + icon?: string; + className?: BoxProps['className']; + title?: string; + value?: any; + }; + export const Option: ForwardRefExoticComponent; + + type PaginationProps = BoxProps & { + count: number; + current?: number; + itemsPerPage?: 25 | 50 | 100; + itemsPerPageLabel?: () => string; + showingResultsLabel?: (props: { count: number; current: number; itemsPerPage: 25 | 50 | 100 }) => string; + onSetCurrent?: Dispatch>; + onSetItemsPerPage?: Dispatch>; + }; + export const Pagination: ForwardRefExoticComponent; + + type PasswordInputProps = BoxProps & { + error?: string; + }; + export const PasswordInput: ForwardRefExoticComponent; + + type SearchInputProps = BoxProps & { + addon?: ReactNode; + error?: string; + }; + export const SearchInput: ForwardRefExoticComponent; + + type SkeletonProps = BoxProps & { + variant?: 'rect'; + }; + export const Skeleton: ForwardRefExoticComponent; + + type TableProps = BoxProps; + type TableHeadProps = BoxProps; + type TableBodyProps = BoxProps; + type TableRowProps = Omit & { + action?: boolean; + }; + type TableCellProps = BoxProps & { + align?: 'start' | 'center' | 'end'; + clickable?: boolean; + }; + export const Table: ForwardRefExoticComponent & { + Head: ForwardRefExoticComponent; + Body: ForwardRefExoticComponent; + Row: ForwardRefExoticComponent; + Cell: ForwardRefExoticComponent; + }; + + type TagProps = BoxProps & { + variant?: 'secondary' | 'primary' | 'danger'; + }; + export const Tag: ForwardRefExoticComponent; + + type TextAreaInputProps = BoxProps; + export const TextAreaInput: ForwardRefExoticComponent; + + type TextInputProps = BoxProps & { + addon?: ReactNode; + error?: string; + }; + export const TextInput: ForwardRefExoticComponent; + + type TileProps = BoxProps; + export const Tile: ForwardRefExoticComponent; + + type ThrobberProps = Omit & { + size?: BoxProps['width']; + inheritColor?: boolean; + }; + export const Throbber: ForwardRefExoticComponent; + + type ToggleSwitchProps = BoxProps; + export const ToggleSwitch: ForwardRefExoticComponent; + + type MarginsProps = PropsWithChildren<{ + all?: BoxProps['margin']; + block?: BoxProps['marginBlock']; + blockStart?: BoxProps['marginBlockStart']; + blockEnd?: BoxProps['marginBlockEnd']; + inline?: BoxProps['marginInline']; + inlineStart?: BoxProps['marginInlineStart']; + inlineEnd?: BoxProps['marginInlineEnd']; + }>; + export const Margins: ForwardRefExoticComponent; + + type ScrollableProps = PropsWithChildren<{ + horizontal?: boolean; + vertical?: boolean; + onScrollContent?: (touching: { top: boolean }) => void; + }>; + export const Scrollable: ForwardRefExoticComponent; + + type SelectOptions = [string, string][]; + type SelectProps = BoxProps & { + error?: string; + options: SelectOptions; + }; + export const Select: ForwardRefExoticComponent; + + type StatusBulletProps = { + status?: 'loading' | 'online' | 'busy' | 'away' | 'offline'; + size?: 'small' | 'large'; + } & Omit, 'size'>; + export const StatusBullet: FC; }