@brickslab./ui-mobile 0.1.1

package/dist/index.d.cts

@@ -0,0 +1,393 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import React from 'react';
+import { ViewStyle, TextStyle } from 'react-native';
+
+type ButtonVariant = 'primary' | 'secondary' | 'ghost' | 'danger' | 'custom';
+type ButtonSize = 'sm' | 'md' | 'lg';
+interface ButtonProps {
+    variant?: ButtonVariant;
+    size?: ButtonSize;
+    disabled?: boolean;
+    isLoading?: boolean;
+    leftIcon?: React.ReactNode;
+    rightIcon?: React.ReactNode;
+    fullWidth?: boolean;
+    onPress?: () => void;
+    children: React.ReactNode;
+    /**
+     * complémentaire à `variant="custom"` ; couleur de fond
+     */
+    customBg?: string;
+    /**
+     * complémentaire à `variant="custom"` ; couleur du texte
+     */
+    customColor?: string;
+    /**
+     * style inline supplémentaire
+     */
+    style?: ViewStyle;
+}
+
+declare function Button({ variant, size, disabled, isLoading, leftIcon, rightIcon, fullWidth, onPress, children, customBg, customColor, style: userStyle, }: ButtonProps): react_jsx_runtime.JSX.Element;
+
+type InputSize = 'sm' | 'md' | 'lg';
+interface InputProps {
+    value: string;
+    onChangeText: (value: string) => void;
+    keyboardType?: 'default' | 'email-address' | 'numeric' | 'phone-pad' | 'url';
+    label?: string;
+    placeholder?: string;
+    helperText?: string;
+    errorText?: string;
+    disabled?: boolean;
+    editable?: boolean;
+    leftIcon?: React.ReactNode;
+    rightIcon?: React.ReactNode;
+    size?: InputSize;
+    fullWidth?: boolean;
+    style?: ViewStyle;
+    inputStyle?: TextStyle;
+}
+
+declare function Input({ value, onChangeText, keyboardType, label, placeholder, helperText, errorText, disabled, editable, leftIcon, rightIcon, size, fullWidth, style: userStyle, inputStyle: userInputStyle, }: InputProps): react_jsx_runtime.JSX.Element;
+
+type CheckboxSize = 'sm' | 'md' | 'lg';
+interface CheckboxProps {
+    checked?: boolean;
+    defaultChecked?: boolean;
+    onValueChange?: (checked: boolean) => void;
+    label?: React.ReactNode;
+    disabled?: boolean;
+    size?: CheckboxSize;
+    style?: ViewStyle;
+}
+
+declare function Checkbox({ checked, defaultChecked, onValueChange, label, disabled, size, style: userStyle, }: CheckboxProps): react_jsx_runtime.JSX.Element;
+
+type RadioSize = 'sm' | 'md' | 'lg';
+interface RadioProps {
+    value: string;
+    checked?: boolean;
+    onChange?: (value: string) => void;
+    label?: React.ReactNode;
+    name?: string;
+    disabled?: boolean;
+    size?: RadioSize;
+    style?: ViewStyle;
+}
+interface RadioGroupProps {
+    name: string;
+    value?: string;
+    onChange?: (value: string) => void;
+    children: React.ReactNode;
+    direction?: 'vertical' | 'horizontal';
+    gap?: number;
+    style?: ViewStyle;
+}
+
+declare function Radio({ value, checked, onChange, label, name, disabled, size, style: userStyle, }: RadioProps): react_jsx_runtime.JSX.Element;
+declare function RadioGroup({ name, value, onChange, children, direction, gap, style: userStyle, }: RadioGroupProps): react_jsx_runtime.JSX.Element;
+
+interface ToggleSwitchProps {
+    checked: boolean;
+    onValueChange: (checked: boolean) => void;
+    label?: string;
+    disabled?: boolean;
+    style?: ViewStyle;
+}
+
+declare function ToggleSwitch({ checked, onValueChange, label, disabled, style: userStyle, }: ToggleSwitchProps): react_jsx_runtime.JSX.Element;
+
+type BadgeVariant = 'default' | 'info' | 'success' | 'warning' | 'error';
+type BadgeSize = 'sm' | 'md' | 'lg';
+interface BadgeProps {
+    variant?: BadgeVariant;
+    size?: BadgeSize;
+    children?: React.ReactNode;
+    dot?: boolean;
+    outlined?: boolean;
+    max?: number;
+    style?: ViewStyle;
+    textStyle?: TextStyle;
+}
+
+declare function Badge({ variant, size, children, dot, outlined, max, style: userStyle, textStyle: userTextStyle, }: BadgeProps): react_jsx_runtime.JSX.Element;
+
+type TabsVariant = 'underline' | 'pills' | 'boxed';
+type TabsSize = 'sm' | 'md' | 'lg';
+interface TabItem {
+    value: string;
+    label: React.ReactNode;
+    icon?: React.ReactNode;
+    disabled?: boolean;
+}
+interface TabsProps {
+    tabs: TabItem[];
+    value: string;
+    onChange: (value: string) => void;
+    variant?: TabsVariant;
+    size?: TabsSize;
+    fullWidth?: boolean;
+    style?: ViewStyle;
+}
+interface TabPanelProps {
+    value: string;
+    activeValue: string;
+    children: React.ReactNode;
+    style?: ViewStyle;
+}
+
+declare function Tabs({ tabs, value, onChange, variant, size, fullWidth, style: userStyle, }: TabsProps): react_jsx_runtime.JSX.Element;
+declare function TabPanel({ value, activeValue, children, style: userStyle }: TabPanelProps): react_jsx_runtime.JSX.Element | null;
+
+type AlertVariant = 'info' | 'success' | 'warning' | 'error';
+interface AlertProps {
+    variant?: AlertVariant;
+    title?: string;
+    children: React.ReactNode;
+    dismissible?: boolean;
+    onDismiss?: () => void;
+    icon?: boolean;
+    fullWidth?: boolean;
+    style?: ViewStyle;
+}
+
+declare function Alert({ variant, title, children, dismissible, onDismiss, icon, fullWidth, style: userStyle, }: AlertProps): react_jsx_runtime.JSX.Element;
+
+type ProgressBarColorScheme = 'brand' | 'green' | 'amber' | 'red';
+type ProgressBarSize = 'sm' | 'md';
+interface ProgressBarProps {
+    value: number;
+    max?: number;
+    label?: string;
+    colorScheme?: ProgressBarColorScheme;
+    size?: ProgressBarSize;
+    showValue?: boolean;
+    animate?: boolean;
+    duration?: number;
+    style?: ViewStyle;
+}
+
+declare function ProgressBar({ value, max, label, colorScheme, size, showValue, animate, duration, style: userStyle, }: ProgressBarProps): react_jsx_runtime.JSX.Element;
+
+type SpinnerSize = 'small' | 'large';
+type SpinnerVariant = 'default' | 'brand' | 'success' | 'warning' | 'error' | 'white';
+interface SpinnerProps {
+    size?: SpinnerSize;
+    variant?: SpinnerVariant;
+    label?: string;
+    style?: ViewStyle;
+}
+
+declare function Spinner({ size, variant, label, style: userStyle, }: SpinnerProps): react_jsx_runtime.JSX.Element;
+
+type SelectSize = 'sm' | 'md' | 'lg';
+interface SelectOption {
+    value: string;
+    label: string;
+    disabled?: boolean;
+}
+interface SelectProps {
+    value: string;
+    onChange: (value: string) => void;
+    options: SelectOption[];
+    label?: string;
+    placeholder?: string;
+    helperText?: string;
+    errorText?: string;
+    disabled?: boolean;
+    size?: SelectSize;
+    fullWidth?: boolean;
+    style?: ViewStyle;
+}
+
+declare function Select({ value, onChange, options, label, placeholder, helperText, errorText, disabled, size, fullWidth, style: userStyle, }: SelectProps): react_jsx_runtime.JSX.Element;
+
+type TextareaSize = 'sm' | 'md' | 'lg';
+interface TextareaProps {
+    value: string;
+    onChangeText: (value: string) => void;
+    label?: string;
+    placeholder?: string;
+    helperText?: string;
+    errorText?: string;
+    disabled?: boolean;
+    editable?: boolean;
+    size?: TextareaSize;
+    fullWidth?: boolean;
+    numberOfLines?: number;
+    maxLength?: number;
+    style?: ViewStyle;
+    inputStyle?: TextStyle;
+}
+
+declare function Textarea({ value, onChangeText, label, placeholder, helperText, errorText, disabled, editable, size, fullWidth, numberOfLines, maxLength, style: userStyle, inputStyle: userInputStyle, }: TextareaProps): react_jsx_runtime.JSX.Element;
+
+type AccordionVariant = 'bordered' | 'separated' | 'ghost';
+type AccordionSize = 'sm' | 'md' | 'lg';
+interface AccordionProps {
+    children: React.ReactNode;
+    variant?: AccordionVariant;
+    size?: AccordionSize;
+    style?: ViewStyle;
+}
+interface AccordionItemProps {
+    title: React.ReactNode;
+    children: React.ReactNode;
+    open?: boolean;
+    onToggle?: (open: boolean) => void;
+    disabled?: boolean;
+    icon?: React.ReactNode;
+    style?: ViewStyle;
+}
+
+declare function Accordion({ children, variant, size, style: userStyle, }: AccordionProps): react_jsx_runtime.JSX.Element;
+declare function AccordionItem({ title, children, open: controlledOpen, onToggle, disabled, icon, style: userStyle, }: AccordionItemProps): react_jsx_runtime.JSX.Element;
+
+type CalloutVariant = 'info' | 'warning' | 'tip' | 'danger';
+interface CalloutProps {
+    variant?: CalloutVariant;
+    title?: string;
+    children?: React.ReactNode;
+    style?: ViewStyle;
+}
+
+declare function Callout({ variant, title, children, style: userStyle, }: CalloutProps): react_jsx_runtime.JSX.Element;
+
+type StatusVariant = 'active' | 'inactive' | 'pending' | 'error';
+interface StatusLabelProps {
+    status: StatusVariant;
+    label?: string;
+    style?: ViewStyle;
+}
+
+declare function StatusLabel({ status, label, style: userStyle, }: StatusLabelProps): react_jsx_runtime.JSX.Element;
+
+interface TagChipProps {
+    label: string;
+    variant?: 'default' | 'brand' | 'muted';
+    size?: 'sm' | 'md';
+    style?: ViewStyle;
+    textStyle?: TextStyle;
+}
+
+declare function TagChip({ label, variant, size, style: userStyle, textStyle: userTextStyle, }: TagChipProps): react_jsx_runtime.JSX.Element;
+
+interface TextProps {
+    texte: string;
+    variant?: 'body-sm' | 'body-md' | 'body-lg' | 'caption';
+    align?: 'left' | 'center' | 'right';
+    tone?: 'default' | 'muted' | 'brand';
+    opacity?: number;
+    blurPx?: number;
+    style?: TextStyle;
+}
+
+declare function Text({ texte, variant, align, tone, opacity, blurPx, style: userStyle, }: TextProps): react_jsx_runtime.JSX.Element;
+
+interface HeadingProps {
+    title: string;
+    level?: 1 | 2 | 3 | 4 | 5 | 6;
+    align?: 'left' | 'center' | 'right';
+    opacity?: number;
+    blurPx?: number;
+    tone?: 'brand' | 'muted';
+    style?: TextStyle;
+}
+
+declare function Heading({ title, level, align, opacity, blurPx, tone, style: userStyle, }: HeadingProps): react_jsx_runtime.JSX.Element;
+
+interface AppShellProps {
+    header?: React.ReactNode;
+    sidebar?: React.ReactNode;
+    footer?: React.ReactNode;
+    children: React.ReactNode;
+    sidebarWidth?: number;
+    headerHeight?: number;
+    footerHeight?: number;
+    style?: ViewStyle;
+}
+
+declare function AppShell({ header, sidebar, footer, children, sidebarWidth, headerHeight, footerHeight, style: userStyle, }: AppShellProps): react_jsx_runtime.JSX.Element;
+
+interface ScreenProps {
+    children: React.ReactNode;
+    scrollable?: boolean;
+    style?: ViewStyle;
+}
+
+declare function Screen({ children, scrollable, style: userStyle }: ScreenProps): react_jsx_runtime.JSX.Element;
+
+interface CardProps {
+    children?: React.ReactNode;
+    style?: ViewStyle;
+    variant?: 'default' | 'elevated' | 'outlined';
+    padding?: 'sm' | 'md' | 'lg';
+}
+declare function Card({ children, style, variant, padding, }: CardProps): react_jsx_runtime.JSX.Element;
+
+declare const tokens: {
+    colorBg: string;
+    colorFg: string;
+    colorMuted: string;
+    colorBrand: string;
+    colorSuccess: string;
+    colorWarning: string;
+    colorError: string;
+    colorInfo: string;
+    colorTransparent: string;
+    cSurfaceElevated: string;
+    cBorder: string;
+    cBrandSubtle: string;
+    cBrandBorder: string;
+    cSuccessSubtle: string;
+    cSuccessBorder: string;
+    cWarningSubtle: string;
+    cWarningBorder: string;
+    fontsize2xs: number;
+    fontsizeXs: number;
+    fontsizeSm: number;
+    fontsizeMedium: number;
+    fontsizeLg: number;
+    fontsizeXl: number;
+    fontsize2xl: number;
+    fontsize3xl: number;
+    fontsize4xl: number;
+    fontsize5xl: number;
+    fontweightThin: string;
+    fontweightNormal: string;
+    fontweightLight: string;
+    fontweightMedium: string;
+    fontweightSemibold: string;
+    fontweightBold: string;
+    fontweightExtrabold: string;
+    fontweightBlack: string;
+    heightXm: number;
+    heightSm: number;
+    heightMd: number;
+    heightInput: number;
+    heightLg: number;
+    heightXl: number;
+    height2xl: number;
+    space1: number;
+    space15: number;
+    space2: number;
+    space3: number;
+    space4: number;
+    space5: number;
+    space6: number;
+    space7: number;
+    space8: number;
+    space10: number;
+    space12: number;
+    space16: number;
+    radiusSm: number;
+    radiusMd: number;
+    radiusLg: number;
+    radiusFull: number;
+    borderXm: number;
+    borderSm: number;
+    borderMd: number;
+};
+
+export { Accordion, AccordionItem, Alert, AppShell, Badge, Button, Callout, Card, Checkbox, Heading, Input, ProgressBar, Radio, RadioGroup, Screen, Select, Spinner, StatusLabel, TabPanel, Tabs, TagChip, Text, Textarea, ToggleSwitch, tokens };