kitchn/dist/native/index.d.mts

Tonight Pass delicious React styled-components UI kit

import * as react_native from 'react-native';
import { ViewComponent, TextProps as TextProps$1 } from 'react-native';
import * as styled_components_native_dist_constructors_constructWithOptions from 'styled-components/native/dist/constructors/constructWithOptions';
import * as styled_components_native_dist_types from 'styled-components/native/dist/types';
export * from 'styled-components/native/dist/types';
import * as styled_components_native from 'styled-components/native';
import { DefaultTheme as DefaultTheme$1 } from 'styled-components/native';
export { ThemeContext as StyledThemeContext, ThemeProvider as StyledThemeProvider, ThemeConsumer, css, isStyledComponent, useTheme as useStyledTheme, withTheme } from 'styled-components/native';
import { T as Theme, M as MainTheme, A as AccentColors, G as Gap, B as Breakpoint, S as Size, L as LayoutColors, R as Radius, b as TextColors, W as Weight } from '../shorten-name-N9SVZnuH.mjs';
export { C as Colors, a as Themes, c as capitalize, e as convertRGBToRGBA, d as darkTheme, g as getId, h as isDevelopment, i as isNumber, f as isString, l as lightTheme, p as pickChild, s as shortenName, t as tonightpassTheme } from '../shorten-name-N9SVZnuH.mjs';
import * as styled_components from 'styled-components';
import { DefaultTheme } from 'styled-components';
import React__default from 'react';
import { TouchableOpacityProps, NativeSyntheticEvent, TextInputChangeEventData, TextInputProps } from 'react-native/types';

declare module "styled-components" {
    interface DefaultTheme extends Theme, MainTheme {
    }
}

type KitchnComponent<P, N = object> = {
    /**
     * The root element.
     */
    as?: React.ElementType;
    /**
     * The content, duh.
     */
    children?: React.ReactNode;
} & P & Omit<N, keyof P>;
type NormalSizes = "small" | "normal" | "large";

declare const mainTheme: MainTheme;

declare const createTheme: (theme: Theme) => DefaultTheme;
declare const defaultThemes: {
    dark: DefaultTheme;
    light: DefaultTheme;
};

type Props$4 = {
    shape?: "square" | "round";
    size?: NormalSizes;
    loading?: boolean;
    disabled?: boolean;
    width?: number | string;
    prefix?: React__default.ReactNode;
    suffix?: React__default.ReactNode;
    type?: keyof AccentColors;
    variant?: "ghost" | "shadow";
    children?: string | React__default.ReactNode;
};
type ButtonProps = KitchnComponent<Props$4, TouchableOpacityProps>;
declare const Button: styled_components_native.IStyledComponent<"native", styled_components_native_dist_types.Substitute<({
    as?: React__default.ElementType;
    children?: React__default.ReactNode;
} & Props$4 & Omit<TouchableOpacityProps, keyof Props$4> & ScaleProps) | ({
    as?: React__default.ElementType;
    children?: React__default.ReactNode;
} & Props$4 & Omit<TouchableOpacityProps, keyof Props$4> & ScaleProps & React__default.RefAttributes<React__default.Component<{
    as?: React__default.ElementType;
    children?: React__default.ReactNode;
} & Props$4 & Omit<TouchableOpacityProps, keyof Props$4> & ScaleProps, any, any>>), {
    as?: React__default.ElementType;
    children?: React__default.ReactNode;
} & Props$4 & Omit<TouchableOpacityProps, keyof Props$4> & ScaleProps>>;

type ScaleProps = {
    width?: string | number | keyof Gap | keyof Breakpoint;
    height?: string | number | keyof Gap | keyof Breakpoint;
    padding?: string | number | keyof Gap;
    margin?: string | number | keyof Gap;
    w?: string | number | keyof Gap | keyof Breakpoint;
    h?: string | number | keyof Gap | keyof Breakpoint;
    p?: string | number | keyof Gap;
    m?: string | number | keyof Gap;
    paddingLeft?: string | number | keyof Gap;
    paddingRight?: string | number | keyof Gap;
    paddingTop?: string | number | keyof Gap;
    paddingBottom?: string | number | keyof Gap;
    pl?: string | number | keyof Gap;
    pr?: string | number | keyof Gap;
    pt?: string | number | keyof Gap;
    pb?: string | number | keyof Gap;
    marginLeft?: string | number | keyof Gap;
    marginRight?: string | number | keyof Gap;
    marginTop?: string | number | keyof Gap;
    marginBottom?: string | number | keyof Gap;
    ml?: string | number | keyof Gap;
    mr?: string | number | keyof Gap;
    mt?: string | number | keyof Gap;
    mb?: string | number | keyof Gap;
    px?: string | number | keyof Gap;
    py?: string | number | keyof Gap;
    mx?: string | number | keyof Gap;
    my?: string | number | keyof Gap;
    minWidth?: string | number | keyof Gap | keyof Breakpoint;
    minHeight?: string | number | keyof Gap | keyof Breakpoint;
    maxWidth?: string | number | keyof Gap | keyof Breakpoint;
    maxHeight?: string | number | keyof Gap | keyof Breakpoint;
    minW?: string | number | keyof Gap | keyof Breakpoint;
    minH?: string | number | keyof Gap | keyof Breakpoint;
    maxW?: string | number | keyof Gap | keyof Breakpoint;
    maxH?: string | number | keyof Gap | keyof Breakpoint;
    font?: string | number | keyof Size;
};
declare const withScale: <T extends object>(WrappedComponent: React__default.ComponentType<T & ScaleProps>) => styled_components_native.IStyledComponent<"native", styled_components_native_dist_types.Substitute<(React__default.PropsWithoutRef<T & ScaleProps> & React__default.RefAttributes<React__default.Component<T & ScaleProps, any, any>>) | React__default.PropsWithRef<T & ScaleProps>, T & ScaleProps>>;

type Props$3 = {
    row?: boolean;
    flex?: number | string;
    gap?: keyof Gap | number;
    align?: "center" | "flex-start" | "flex-end" | "stretch" | "baseline";
    justify?: "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | "space-evenly" | "stretch";
    background?: string | keyof LayoutColors;
    bg?: string | keyof LayoutColors;
    backgroundColor?: keyof LayoutColors;
    bgc?: keyof LayoutColors;
    backgroundAccent?: keyof AccentColors;
    bga?: keyof AccentColors;
    borderRadius?: number | string | keyof Radius;
    br?: number | string | keyof Radius;
};
type ContainerProps = KitchnComponent<Props$3, ViewComponent>;
declare const Container: styled_components_native.IStyledComponent<"native", styled_components_native_dist_types.Substitute<(styled_components_native_dist_types.FastOmit<{
    as?: React__default.ElementType;
    children?: React__default.ReactNode;
} & Props$3 & Omit<ViewComponent, keyof Props$3>, never> & ScaleProps) | (styled_components_native_dist_types.FastOmit<{
    as?: React__default.ElementType;
    children?: React__default.ReactNode;
} & Props$3 & Omit<ViewComponent, keyof Props$3>, never> & ScaleProps & React__default.RefAttributes<React__default.Component<styled_components_native_dist_types.FastOmit<{
    as?: React__default.ElementType;
    children?: React__default.ReactNode;
} & Props$3 & Omit<ViewComponent, keyof Props$3>, never> & ScaleProps, any, any>>), styled_components_native_dist_types.FastOmit<{
    as?: React__default.ElementType;
    children?: React__default.ReactNode;
} & Props$3 & Omit<ViewComponent, keyof Props$3>, never> & ScaleProps>>;

type Props$2 = {
    name: string;
    size?: number | string | keyof Size;
    fill?: boolean;
    /**
     * The text color. Strictly limited to colors of our design system. If you want to pass accent color make sure to pass `accent` instead of `color`.
     */
    color?: keyof TextColors | string;
    /**
     * The accent color. Strictly limited to colors of our design system, but can be used in combination with `color` prop.
     */
    accent?: keyof AccentColors;
};
type IconProps = KitchnComponent<Props$2>;
declare const Icon: styled_components_native.IStyledComponent<"native", styled_components_native_dist_types.Substitute<({
    as?: React__default.ElementType;
    children?: React__default.ReactNode;
} & Props$2 & Omit<object, keyof Props$2> & ScaleProps) | ({
    as?: React__default.ElementType;
    children?: React__default.ReactNode;
} & Props$2 & Omit<object, keyof Props$2> & ScaleProps & React__default.RefAttributes<React__default.Component<{
    as?: React__default.ElementType;
    children?: React__default.ReactNode;
} & Props$2 & Omit<object, keyof Props$2> & ScaleProps, any, any>>), {
    as?: React__default.ElementType;
    children?: React__default.ReactNode;
} & Props$2 & Omit<object, keyof Props$2> & ScaleProps>>;

type Props$1 = {
    name?: string;
    placeholder?: string;
    size?: NormalSizes;
    prefix?: JSX.Element | string;
    suffix?: JSX.Element | string;
    initialValue?: string;
    value?: string;
    disabled?: boolean;
    prefixStyling?: boolean;
    suffixStyling?: boolean;
    prefixContainer?: boolean;
    suffixContainer?: boolean;
    clearable?: boolean;
    width?: number | string;
    error?: string;
    readOnly?: boolean;
    onClearClick?: (_event: any) => void;
    type?: keyof AccentColors;
    label?: string;
    onChange?: (_event: NativeSyntheticEvent<InputChangeEventData>) => void;
    onChangeText?: (_value: string) => void;
    pattern?: {
        [key: string]: RegExp;
    };
};
type InputProps = KitchnComponent<Props$1, TextInputProps>;
type InputChangeEventData = TextInputChangeEventData & {
    name?: string;
    pattern?: {
        [key: string]: RegExp;
    };
};

type KitchnProviderProps = {
    children?: React__default.ReactNode;
    theme?: DefaultTheme$1;
};
declare const KitchnProvider: styled_components_native.IStyledComponent<"native", styled_components_native_dist_types.Substitute<(KitchnProviderProps & ScaleProps) | (KitchnProviderProps & ScaleProps & React__default.RefAttributes<React__default.Component<KitchnProviderProps & ScaleProps, any, any>>), KitchnProviderProps & ScaleProps>>;

type Props = {
    /**
     * The font size.
     */
    size?: keyof Size;
    /**
     * The line height.
     */
    lineHeight?: number | string;
    /**
     * The font weight.
     */
    weight?: keyof Weight;
    /**
     * Text transform short hand.
     * @see https://developer.mozilla.org/en-US/docs/Web/CSS/text-transform
     * @default "initial"
     */
    transform?: "capitalize" | "uppercase" | "lowercase" | "none";
    /**
     * The text color. Strictly limited to colors of our design system. If you want to pass accent color make sure to pass `accent` instead of `color`.
     */
    color?: keyof TextColors;
    /**
     * The accent color. Strictly limited to colors of our design system, but can be used in combination with `color` prop.
     */
    accent?: keyof AccentColors;
    /**
     * Truncate a single or multiple line(s). If you pass truncate, make sure to pass `title` so that the full value is shown on hover.
     * @default false
     */
    truncate?: boolean | number;
    /**
     * Text alignment short hand.
     */
    align?: "left" | "center" | "right";
    /**
     * If text is `truncated`, this should be the full text.
     */
    title?: string;
    /**
     * Whether the text should wrap lines
     * @type {boolean}
     * @default true
     */
    wrap?: boolean;
    /**
     * 	Whether to use the monospace font.
     * @type {boolean}
     * @default false
     */
    monospace?: boolean;
};
type TextProps = KitchnComponent<Props, TextProps$1>;
declare const Text: styled_components_native.IStyledComponent<"native", styled_components_native_dist_types.Substitute<(styled_components_native_dist_types.FastOmit<{
    as?: React__default.ElementType;
    children?: React__default.ReactNode;
} & Props & Omit<TextProps$1, keyof Props>, "as" | keyof TextProps$1 | keyof Props> & {
    as?: React__default.ElementType;
    children?: React__default.ReactNode;
} & Props & Omit<TextProps$1, keyof Props> & ScaleProps) | (styled_components_native_dist_types.FastOmit<{
    as?: React__default.ElementType;
    children?: React__default.ReactNode;
} & Props & Omit<TextProps$1, keyof Props>, "as" | keyof TextProps$1 | keyof Props> & {
    as?: React__default.ElementType;
    children?: React__default.ReactNode;
} & Props & Omit<TextProps$1, keyof Props> & ScaleProps & React__default.RefAttributes<React__default.Component<styled_components_native_dist_types.FastOmit<{
    as?: React__default.ElementType;
    children?: React__default.ReactNode;
} & Props & Omit<TextProps$1, keyof Props>, "as" | keyof TextProps$1 | keyof Props> & {
    as?: React__default.ElementType;
    children?: React__default.ReactNode;
} & Props & Omit<TextProps$1, keyof Props> & ScaleProps, any, any>>), styled_components_native_dist_types.FastOmit<{
    as?: React__default.ElementType;
    children?: React__default.ReactNode;
} & Props & Omit<TextProps$1, keyof Props>, "as" | keyof TextProps$1 | keyof Props> & {
    as?: React__default.ElementType;
    children?: React__default.ReactNode;
} & Props & Omit<TextProps$1, keyof Props> & ScaleProps>>;

declare const useTheme: () => {
    theme: styled_components.DefaultTheme;
    setTheme: (_theme: styled_components_native.DefaultTheme) => void;
};

declare const kitchn: (<Target extends styled_components_native.NativeTarget>(tag: Target) => styled_components_native_dist_constructors_constructWithOptions.Styled<"native", Target, Target extends styled_components_native_dist_types.KnownTarget ? React.ComponentPropsWithRef<Target> : styled_components_native_dist_types.BaseObject, styled_components_native_dist_types.BaseObject>) & {
    ActivityIndicator: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.ActivityIndicator, react_native.ActivityIndicatorProps, styled_components_native_dist_types.BaseObject>;
    Button: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.Button, react_native.ButtonProps, styled_components_native_dist_types.BaseObject>;
    DatePickerIOS: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.DatePickerIOS, react_native.DatePickerIOSProps, styled_components_native_dist_types.BaseObject>;
    DrawerLayoutAndroid: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.DrawerLayoutAndroid, react_native.DrawerLayoutAndroidProps, styled_components_native_dist_types.BaseObject>;
    FlatList: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.FlatList, react_native.FlatListProps<unknown>, styled_components_native_dist_types.BaseObject>;
    Image: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.Image, react_native.ImageProps, styled_components_native_dist_types.BaseObject>;
    ImageBackground: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.ImageBackground, react_native.ImageBackgroundProps, styled_components_native_dist_types.BaseObject>;
    KeyboardAvoidingView: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.KeyboardAvoidingView, react_native.KeyboardAvoidingViewProps, styled_components_native_dist_types.BaseObject>;
    Modal: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.Modal, react_native.ModalBaseProps & react_native.ModalPropsIOS & react_native.ModalPropsAndroid & react_native.ViewProps, styled_components_native_dist_types.BaseObject>;
    Pressable: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", React.ForwardRefExoticComponent<react_native.PressableProps & React.RefAttributes<react_native.View>>, react_native.PressableProps & React.RefAttributes<react_native.View>, styled_components_native_dist_types.BaseObject>;
    ProgressBarAndroid: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.ProgressBarAndroid, react_native.ProgressBarAndroidProps, styled_components_native_dist_types.BaseObject>;
    ProgressViewIOS: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.ProgressViewIOS, react_native.ProgressViewIOSProps, styled_components_native_dist_types.BaseObject>;
    RefreshControl: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.RefreshControl, react_native.RefreshControlProps, styled_components_native_dist_types.BaseObject>;
    SafeAreaView: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.SafeAreaView, react_native.ViewProps, styled_components_native_dist_types.BaseObject>;
    ScrollView: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.ScrollView, react_native.ScrollViewProps, styled_components_native_dist_types.BaseObject>;
    SectionList: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.SectionList, react_native.SectionListProps<unknown, unknown>, styled_components_native_dist_types.BaseObject>;
    Slider: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.Slider, react_native.SliderProps, styled_components_native_dist_types.BaseObject>;
    Switch: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.Switch, react_native.SwitchProps, styled_components_native_dist_types.BaseObject>;
    Text: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.Text, react_native.TextProps, styled_components_native_dist_types.BaseObject>;
    TextInput: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.TextInput, react_native.TextInputProps, styled_components_native_dist_types.BaseObject>;
    TouchableHighlight: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.TouchableHighlight, react_native.TouchableHighlightProps, styled_components_native_dist_types.BaseObject>;
    TouchableOpacity: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.TouchableOpacity, react_native.TouchableOpacityProps, styled_components_native_dist_types.BaseObject>;
    View: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.View, react_native.ViewProps, styled_components_native_dist_types.BaseObject>;
    VirtualizedList: styled_components_native_dist_constructors_constructWithOptions.Styled<"native", typeof react_native.VirtualizedList, react_native.VirtualizedListProps<unknown>, styled_components_native_dist_types.BaseObject>;
};

export { AccentColors, Breakpoint, Button, type ButtonProps, Container, type ContainerProps, Gap, Icon, type IconProps, type InputChangeEventData, type InputProps, type KitchnComponent, KitchnProvider, type KitchnProviderProps, LayoutColors, MainTheme, type NormalSizes, Radius, type ScaleProps, Size, Text, TextColors, type TextProps, Theme, Weight, createTheme, kitchn as default, defaultThemes, mainTheme, useTheme, withScale };