UNPKG

@teaui/react

Version:

React Reconciler and renderer for TeaUI

144 lines (143 loc) 7.15 kB
import React from 'react'; import type { Accordion as WrAccordion, Box as WrBox, Button as WrButton, Checkbox as WrCheckbox, Collapsible as WrCollapsible, CollapsibleText as WrCollapsibleText, ConsoleLog as WrConsoleLog, Digits as WrDigits, Drawer as WrDrawer, Stack as WrStack, Input as WrInput, Scrollable as WrScrollable, Separator as WrSeparator, Slider as WrSlider, Space as WrSpace, Tabs as WrTabs, ToggleGroup as WrToggleGroup, ViewProps } from '@teaui/core'; import { TextProvider, TextStyle } from './components/TextReact'; type Children = 'children' | 'child'; type TUIView<T extends abstract new (arg: any, ...args: any) => any, OmitProps extends keyof ConstructorParameters<T>[0] = Children> = Omit<NonNullable<ConstructorParameters<T>[0]>, OmitProps>; type TUIContainer<T extends abstract new (arg: any, ...args: any) => any, ChildrenProps extends keyof NonNullable<ConstructorParameters<T>[0]> = Children> = TUIView<T, ChildrenProps> & { [Key in ChildrenProps]?: React.ReactNode; }; type CheckboxProps = TUIView<typeof WrCheckbox>; type CollapsibleTextProps = TUIView<typeof WrCollapsibleText>; type ConsoleProps = TUIView<typeof WrConsoleLog>; type DigitsProps = TUIView<typeof WrDigits>; type HeaderProps = { text?: string; }; type InputProps = TUIView<typeof WrInput>; type SeparatorProps = TUIView<typeof WrSeparator>; type SliderProps = TUIView<typeof WrSlider>; type SpaceProps = TUIView<typeof WrSpace>; type ToggleGroupProps = TUIView<typeof WrToggleGroup>; type BoxProps = TUIContainer<typeof WrBox>; type ButtonProps = TUIContainer<typeof WrButton>; type CollapsibleProps = TUIContainer<typeof WrCollapsible, 'collapsed' | 'expanded' | 'children'>; type ScrollableProps = TUIContainer<typeof WrScrollable>; type StackProps = TUIContainer<typeof WrStack>; type StyleProps = TUIContainer<typeof TextStyle>; type TextProps = TUIContainer<typeof TextProvider>; type AccordionProps = TUIContainer<typeof WrAccordion>; type AccordionSectionProps = TUIContainer<typeof WrAccordion.Section>; type DrawerProps = TUIContainer<typeof WrDrawer, 'content' | 'drawer' | 'children'>; type TabsProps = TUIContainer<typeof WrTabs>; type TabsSectionProps = TUIContainer<typeof WrTabs.Section>; declare module 'react' { namespace JSX { interface IntrinsicElements { 'tui-br': {}; 'tui-checkbox': CheckboxProps; 'tui-collapsible-text': CollapsibleTextProps; 'tui-console': ConsoleProps; 'tui-digits': DigitsProps; 'tui-h1': HeaderProps; 'tui-h2': HeaderProps; 'tui-h3': HeaderProps; 'tui-h4': HeaderProps; 'tui-h5': HeaderProps; 'tui-h6': HeaderProps; 'tui-input': InputProps; 'tui-separator': SeparatorProps; 'tui-slider': SliderProps; 'tui-space': SpaceProps; 'tui-toggle-group': ToggleGroupProps; 'tui-tree': ViewProps; 'tui-box': BoxProps; 'tui-button': ButtonProps; 'tui-collapsible': CollapsibleProps; 'tui-scrollable': ScrollableProps; 'tui-stack': StackProps; 'tui-style': StyleProps; 'tui-text': TextProps; 'tui-accordion': AccordionProps; 'tui-accordion-section': AccordionSectionProps; 'tui-drawer': DrawerProps; 'tui-tabs': TabsProps; 'tui-tabs-section': TabsSectionProps; } } } export declare function Br(): JSX.Element; export declare function Checkbox(reactProps: CheckboxProps): JSX.Element; export declare function CollapsibleText(reactProps: CollapsibleTextProps): JSX.Element; export declare function ConsoleLog(reactProps: ConsoleProps): JSX.Element; export declare function Digits(reactProps: DigitsProps): JSX.Element; export declare function H1(reactProps: HeaderProps): JSX.Element; export declare function H2(reactProps: HeaderProps): JSX.Element; export declare function H3(reactProps: HeaderProps): JSX.Element; export declare function H4(reactProps: HeaderProps): JSX.Element; export declare function H5(reactProps: HeaderProps): JSX.Element; export declare function H6(reactProps: HeaderProps): JSX.Element; export declare function Input(reactProps: InputProps): JSX.Element; interface Separator { (reactProps: SeparatorProps): JSX.Element; horizontal(reactProps: Omit<SeparatorProps, 'direction'>): JSX.Element; vertical(reactProps: Omit<SeparatorProps, 'direction'>): JSX.Element; } export declare const Separator: Separator; interface Slider { (reactProps: SliderProps): JSX.Element; horizontal(reactProps: Omit<SliderProps, 'direction'>): JSX.Element; vertical(reactProps: Omit<SliderProps, 'direction'>): JSX.Element; } export declare const Slider: Slider; export declare function Space(reactProps: SpaceProps): JSX.Element; export declare function ToggleGroup(reactProps: ToggleGroupProps): JSX.Element; interface TreeProps<T> extends ViewProps { data: T[]; render: (datum: T) => React.ReactNode; getChildren?: (datum: T) => T[] | undefined; title: React.ReactNode | string; } export declare function Tree<T>(reactProps: TreeProps<T>): JSX.Element; export declare function Box(reactProps: BoxProps): JSX.Element; export declare function Button(reactProps: ButtonProps): JSX.Element; export declare function Collapsible(reactProps: CollapsibleProps): JSX.Element; interface Stack { (reactProps: StackProps): JSX.Element; down(reactProps: Omit<StackProps, 'direction'>): JSX.Element; up(reactProps: Omit<StackProps, 'direction'>): JSX.Element; left(reactProps: Omit<StackProps, 'direction'>): JSX.Element; right(reactProps: Omit<StackProps, 'direction'>): JSX.Element; } export declare const Stack: Stack; export declare function Scrollable(reactProps: ScrollableProps): JSX.Element; /** * <Style /> is similar to <Text/> but only allows inline styles (bold, etc). * Does not support align or wrap (block styles). Does not support 'font', because * font is not encodable via SGR codes (and that's how I'm styling and * concatenating the text nodes). */ export declare function Style(reactProps: StyleProps): JSX.Element; /** * <Text /> is a container that sets the text properties of child TextLiterals * (font, style) and TextContainers (wrap, alignment) */ export declare function Text(reactProps: TextProps): JSX.Element; interface Accordion { (reactProps: AccordionProps): JSX.Element; Section(reactProps: Omit<AccordionSectionProps, 'direction'>): JSX.Element; } export declare const Accordion: Accordion; interface Drawer { (reactProps: DrawerProps): JSX.Element; top(reactProps: Omit<DrawerProps, 'location'>): JSX.Element; right(reactProps: Omit<DrawerProps, 'location'>): JSX.Element; bottom(reactProps: Omit<DrawerProps, 'location'>): JSX.Element; left(reactProps: Omit<DrawerProps, 'location'>): JSX.Element; } export declare const Drawer: Drawer; interface Tabs { (reactProps: TabsProps): JSX.Element; Section(reactProps: Omit<TabsSectionProps, 'direction'>): JSX.Element; } export declare const Tabs: Tabs; export {};