@kivid/native-components 1.0.0-alpha.1

package/dist/typescript/components/Button/index.d.ts

@@ -0,0 +1,6 @@
+import { ButtonProps } from "./types";
+export declare function Button(props: ButtonProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace Button {
+    var displayName: string;
+}
+export default Button;

package/dist/typescript/components/Button/types.d.ts

@@ -0,0 +1,16 @@
+import type { VariantProps } from "class-variance-authority";
+import { buttonVariants } from "./assets/class-variants";
+import { PressableProps, View } from "react-native";
+export type ButtonVariant = "grape" | "java" | "pear" | "tangerine" | "blackberry" | "chia" | "outline" | "glass" | "ghost";
+export type ButtonSize = "small" | "medium" | "large";
+export type ButtonCorners = "small" | "medium";
+export interface ButtonProps extends VariantProps<typeof buttonVariants>, PressableProps {
+    loading?: boolean;
+    selected?: boolean;
+    disabled?: boolean;
+    className?: string;
+    children?: React.ReactNode;
+    onPress?: () => void;
+    accessibilityLabel?: string;
+    ref?: React.RefObject<View | null>;
+}

package/dist/typescript/components/Chip/assets/class-variants.d.ts

@@ -0,0 +1,5 @@
+export declare const chipVariants: (props?: ({
+    size?: "medium" | "large" | null | undefined;
+    variant?: "outline" | "highlight" | "filled" | null | undefined;
+    sealVariant?: "left" | "right" | "alert" | "add" | "success" | "error" | "minus" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;

package/dist/typescript/components/Chip/enums/chip-size.d.ts

@@ -0,0 +1,4 @@
+export declare enum ChipSizeEnum {
+    MEDIUM = "medium",
+    LARGE = "large"
+}

package/dist/typescript/components/Chip/enums/chip-variant.d.ts

@@ -0,0 +1,5 @@
+export declare enum ChipVariantEnum {
+    HIGHLIGHT = "highlight",
+    FILLED = "filled",
+    OUTLINE = "outline"
+}

package/dist/typescript/components/Chip/enums/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./chip-variant";
+export * from "./chip-size";

package/dist/typescript/components/Chip/index.d.ts

@@ -0,0 +1,2 @@
+import type { ChipProps } from "./types";
+export declare function Chip(props: ChipProps): import("react/jsx-runtime").JSX.Element;

package/dist/typescript/components/Chip/types.d.ts

@@ -0,0 +1,11 @@
+import type { SealVariant } from "../Seal/types";
+import { ChipSizeEnum, ChipVariantEnum } from "./enums";
+export type ChipSize = ChipSizeEnum;
+export type ChipVariant = ChipVariantEnum;
+export interface ChipProps {
+    label: string;
+    className?: string;
+    sealVariant?: SealVariant;
+    size?: ChipSize;
+    variant?: ChipVariant;
+}

package/dist/typescript/components/HighlightedText/index.d.ts

@@ -0,0 +1,6 @@
+import type { HighlightedTextProps } from "./types";
+export declare function HighlightedText(props: HighlightedTextProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace HighlightedText {
+    var displayName: string;
+}
+export default HighlightedText;

package/dist/typescript/components/HighlightedText/types.d.ts

@@ -0,0 +1,9 @@
+import { Text, TextProps } from "react-native";
+export interface HighlightedTextProps extends TextProps {
+    text: string;
+    highlightText?: string;
+    highlightTextClassName?: string;
+    className?: string;
+    ref?: React.RefObject<Text | null>;
+    reverse?: boolean;
+}

package/dist/typescript/components/InformationStatus/components/GradientAdd/index.d.ts

@@ -0,0 +1,3 @@
+import Svg from "react-native-svg";
+import { GradientAddProps } from "./types";
+export declare function GradientAdd(props: GradientAddProps, ref?: React.Ref<Svg>): import("react/jsx-runtime").JSX.Element;

package/dist/typescript/components/InformationStatus/components/GradientAdd/types.d.ts

@@ -0,0 +1,5 @@
+import { SvgProps } from "react-native-svg";
+export interface GradientAddProps extends SvgProps {
+    size?: number;
+    color?: string;
+}

package/dist/typescript/components/InformationStatus/components/GradientAlert/index.d.ts

@@ -0,0 +1,3 @@
+import Svg from "react-native-svg";
+import { GradientAlertProps } from "./types";
+export declare function GradientAlert(props: GradientAlertProps, ref?: React.Ref<Svg>): import("react/jsx-runtime").JSX.Element;

package/dist/typescript/components/InformationStatus/components/GradientAlert/types.d.ts

@@ -0,0 +1,5 @@
+import { SvgProps } from "react-native-svg";
+export interface GradientAlertProps extends SvgProps {
+    size?: number;
+    color?: string;
+}

package/dist/typescript/components/InformationStatus/components/GradientCheck/index.d.ts

@@ -0,0 +1,3 @@
+import Svg from "react-native-svg";
+import { GradientCheckProps } from "./types";
+export declare function GradientCheck(props: GradientCheckProps, ref?: React.Ref<Svg>): import("react/jsx-runtime").JSX.Element;

package/dist/typescript/components/InformationStatus/components/GradientCheck/types.d.ts

@@ -0,0 +1,5 @@
+import { SvgProps } from "react-native-svg";
+export interface GradientCheckProps extends SvgProps {
+    size?: number;
+    color?: string;
+}

package/dist/typescript/components/InformationStatus/components/GradientClose/index.d.ts

@@ -0,0 +1,3 @@
+import Svg from "react-native-svg";
+import { GradientCloseProps } from "./types";
+export declare function GradientClose(props: GradientCloseProps, ref?: React.Ref<Svg>): import("react/jsx-runtime").JSX.Element;

package/dist/typescript/components/InformationStatus/components/GradientClose/types.d.ts

@@ -0,0 +1,5 @@
+import { SvgProps } from "react-native-svg";
+export interface GradientCloseProps extends SvgProps {
+    size?: number;
+    color?: string;
+}

package/dist/typescript/components/InformationStatus/components/index.d.ts

@@ -0,0 +1,4 @@
+export * from "./GradientAdd";
+export * from "./GradientAlert";
+export * from "./GradientCheck";
+export * from "./GradientClose";

package/dist/typescript/components/InformationStatus/enums.d.ts

@@ -0,0 +1,6 @@
+export declare enum InformationStatusOptionsEnum {
+    SUCCESS = "success",
+    ERROR = "error",
+    WARNING = "warning",
+    ADD = "add"
+}

package/dist/typescript/components/InformationStatus/index.d.ts

@@ -0,0 +1,2 @@
+import type { InformationStatusProps } from "./types";
+export declare function InformationStatus(props: InformationStatusProps): import("react/jsx-runtime").JSX.Element;

package/dist/typescript/components/InformationStatus/types.d.ts

@@ -0,0 +1,14 @@
+import { StyleProp, ViewStyle } from "react-native";
+import { SvgProps } from "react-native-svg";
+import { InformationStatusOptionsEnum } from "./enums";
+export interface InformationStatusProps {
+    status: InformationStatusOptionsEnum;
+    size?: "small" | "medium" | "large";
+    square?: boolean;
+    className?: string;
+    style?: StyleProp<ViewStyle>;
+}
+export interface InformationStatusIconProps extends SvgProps {
+    size?: number;
+    color?: string;
+}

package/dist/typescript/components/InputCheckbox/assets/class-variants.d.ts

@@ -0,0 +1,6 @@
+import { CheckboxVariantEnum } from "../enums";
+export declare const inputCheckboxVariants: (props?: ({
+    variant?: CheckboxVariantEnum | null | undefined;
+    isChecked?: boolean | null | undefined;
+    disabled?: boolean | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;

package/dist/typescript/components/InputCheckbox/enums/checkbox-variant.d.ts

@@ -0,0 +1,9 @@
+export declare enum CheckboxVariantEnum {
+    GRAPE = "grape",
+    JAVA = "java",
+    PEAR = "pear",
+    TANGERINE = "tangerine",
+    CHIA = "chia",
+    PITAYA = "pitaya",
+    MANGO = "mango"
+}

package/dist/typescript/components/InputCheckbox/enums/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./checkbox-variant";
+export * from "./select-variant";

package/dist/typescript/components/InputCheckbox/enums/select-variant.d.ts

@@ -0,0 +1,4 @@
+export declare enum SelectVariantEnum {
+    SELECTED = "selected",
+    INDETERMINATE = "indeterminate"
+}

package/dist/typescript/components/InputCheckbox/icons/CheckIcon/index.d.ts

@@ -0,0 +1,2 @@
+import type { SvgProps } from "react-native-svg";
+export declare const CheckIcon: (props: SvgProps) => import("react/jsx-runtime").JSX.Element;

package/dist/typescript/components/InputCheckbox/icons/IndeterminateIcon/index.d.ts

@@ -0,0 +1,2 @@
+import type { SvgProps } from "react-native-svg";
+export declare const IndeterminateIcon: (props: SvgProps) => import("react/jsx-runtime").JSX.Element;

package/dist/typescript/components/InputCheckbox/icons/index.d.ts

@@ -0,0 +1,2 @@
+export { CheckIcon } from "./CheckIcon";
+export { IndeterminateIcon } from "./IndeterminateIcon";

package/dist/typescript/components/InputCheckbox/index.d.ts

@@ -0,0 +1,2 @@
+import type { InputCheckboxProps } from "./types";
+export declare function InputCheckbox(props: InputCheckboxProps): import("react/jsx-runtime").JSX.Element;

package/dist/typescript/components/InputCheckbox/types.d.ts

@@ -0,0 +1,10 @@
+import type { CheckboxVariantEnum, SelectVariantEnum } from "./enums";
+export type CheckboxVariant = CheckboxVariantEnum;
+export type CheckboxSelectType = SelectVariantEnum;
+export interface InputCheckboxProps {
+    isChecked?: boolean;
+    selectType?: CheckboxSelectType;
+    variant?: CheckboxVariant;
+    disabled?: boolean;
+    onChange(value: boolean): void;
+}

package/dist/typescript/components/InputOTP/components/InformationStatus/index.d.ts

@@ -0,0 +1,3 @@
+import type { InformationStatusProps } from "./types";
+export declare function InformationStatus(props: InformationStatusProps): import("react/jsx-runtime").JSX.Element;
+export default InformationStatus;

package/dist/typescript/components/InputOTP/components/InformationStatus/types.d.ts

@@ -0,0 +1,6 @@
+import type { InformationStatusEnum } from "../../enums";
+export interface InformationStatusProps {
+    status: InformationStatusEnum;
+    disabled?: boolean;
+    onPress?: () => void;
+}

package/dist/typescript/components/InputOTP/components/index.d.ts

@@ -0,0 +1 @@
+export * from "./InformationStatus";

package/dist/typescript/components/InputOTP/enums/index.d.ts

@@ -0,0 +1 @@
+export * from "./information-status";

package/dist/typescript/components/InputOTP/enums/information-status.d.ts

@@ -0,0 +1,7 @@
+export declare enum InformationStatusEnum {
+    DEFAULT = "default",
+    ERROR = "error",
+    SUCCESS = "success",
+    LOADING = "loading",
+    COOLDOWN = "cooldown"
+}

package/dist/typescript/components/InputOTP/index.d.ts

@@ -0,0 +1,3 @@
+import type { InputOTPProps } from "./types";
+export declare function InputOTP(props: InputOTPProps): import("react/jsx-runtime").JSX.Element;
+export default InputOTP;

package/dist/typescript/components/InputOTP/types.d.ts

@@ -0,0 +1,11 @@
+import type React from "react";
+import type { InformationStatusEnum } from "./enums";
+export interface InputOTPProps {
+    OTPInputsQuantity?: number;
+    rounded?: boolean;
+    disabled?: boolean;
+    status?: InformationStatusEnum;
+    customInformation?: React.ReactNode;
+    onChange: (value: string) => void;
+    onPressRetryToken?: (value: string) => void;
+}

package/dist/typescript/components/LoadingDots/index.d.ts

@@ -0,0 +1,3 @@
+import type { LoadingDotsProps } from "./types";
+export declare const LoadingDots: ({ variant, className, style, lottieViewStyle, ref, ...rest }: LoadingDotsProps) => import("react/jsx-runtime").JSX.Element;
+export default LoadingDots;

package/dist/typescript/components/LoadingDots/types.d.ts

@@ -0,0 +1,9 @@
+import type { LottieViewProps } from "lottie-react-native";
+import { StyleProp, View, ViewStyle } from "react-native";
+export type LoadingDotsVariant = "grape" | "light" | "dark";
+export interface LoadingDotsProps extends Omit<LottieViewProps, "source"> {
+    variant?: LoadingDotsVariant;
+    lottieViewStyle?: StyleProp<ViewStyle>;
+    className?: string;
+    ref?: React.RefObject<View | null>;
+}

package/dist/typescript/components/Seal/assets/class-variants.d.ts

@@ -0,0 +1,5 @@
+export declare const sealVariants: (props?: ({
+    size?: "small" | "medium" | null | undefined;
+    variant?: "left" | "right" | "alert" | "add" | "success" | "error" | "minus" | null | undefined;
+    inverted?: boolean | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;

package/dist/typescript/components/Seal/components/AddIcon/index.d.ts

@@ -0,0 +1,2 @@
+import type { SealIconProps } from "../../types";
+export declare const AddIcon: ({ size, ...props }: SealIconProps) => import("react/jsx-runtime").JSX.Element;

package/dist/typescript/components/Seal/components/AlertIcon/index.d.ts

@@ -0,0 +1,2 @@
+import type { SealIconProps } from "../../types";
+export declare const AlertIcon: ({ size, ...props }: SealIconProps) => import("react/jsx-runtime").JSX.Element;

package/dist/typescript/components/Seal/components/ErrorIcon/index.d.ts

@@ -0,0 +1,2 @@
+import type { SealIconProps } from "../../types";
+export declare const ErrorIcon: ({ size, ...props }: SealIconProps) => import("react/jsx-runtime").JSX.Element;

package/dist/typescript/components/Seal/components/LeftIcon/index.d.ts

@@ -0,0 +1,2 @@
+import type { SealIconProps } from "../../types";
+export declare const LeftIcon: ({ size, ...props }: SealIconProps) => import("react/jsx-runtime").JSX.Element;

package/dist/typescript/components/Seal/components/MinusIcon/index.d.ts

@@ -0,0 +1,2 @@
+import type { SealIconProps } from "../../types";
+export declare const MinusIcon: ({ size, ...props }: SealIconProps) => import("react/jsx-runtime").JSX.Element;

package/dist/typescript/components/Seal/components/RightIcon/index.d.ts

@@ -0,0 +1,2 @@
+import type { SealIconProps } from "../../types";
+export declare const RightIcon: ({ size, ...props }: SealIconProps) => import("react/jsx-runtime").JSX.Element;

package/dist/typescript/components/Seal/components/SuccessIcon/index.d.ts

@@ -0,0 +1,2 @@
+import type { SealIconProps } from "../../types";
+export declare const SuccessIcon: ({ size, ...props }: SealIconProps) => import("react/jsx-runtime").JSX.Element;

package/dist/typescript/components/Seal/components/index.d.ts

@@ -0,0 +1,7 @@
+export { AddIcon } from "./AddIcon";
+export { SuccessIcon } from "./SuccessIcon";
+export { ErrorIcon } from "./ErrorIcon";
+export { AlertIcon } from "./AlertIcon";
+export { MinusIcon } from "./MinusIcon";
+export { RightIcon } from "./RightIcon";
+export { LeftIcon } from "./LeftIcon";

package/dist/typescript/components/Seal/enums/index.d.ts

@@ -0,0 +1 @@
+export * from "./seal-variant";

package/dist/typescript/components/Seal/enums/seal-variant.d.ts

@@ -0,0 +1,9 @@
+export declare enum SealVariantEnum {
+    ADD = "add",
+    SUCCESS = "success",
+    ERROR = "error",
+    ALERT = "alert",
+    MINUS = "minus",
+    LEFT = "left",
+    RIGHT = "right"
+}

package/dist/typescript/components/Seal/index.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import type { SealProps } from "./types";
+export declare const Seal: React.FC<SealProps>;

package/dist/typescript/components/Seal/types.d.ts

@@ -0,0 +1,14 @@
+import type { SvgProps } from "react-native-svg";
+import { SealVariantEnum } from "./enums";
+export type SealVariant = SealVariantEnum;
+export interface SealIconProps extends SvgProps {
+    size?: SealSize;
+}
+export type SealSize = "small" | "medium";
+export interface SealProps {
+    variant: SealVariant;
+    size?: SealSize;
+    inverted?: boolean;
+    disabled?: boolean;
+    className?: string;
+}

package/dist/typescript/components/Title/components/icon/index.d.ts

@@ -0,0 +1,2 @@
+import type { IconProps } from "./types";
+export declare function Icon(props: IconProps): import("react/jsx-runtime").JSX.Element;

package/dist/typescript/components/Title/components/icon/types.d.ts

@@ -0,0 +1,12 @@
+export declare enum IconVariants {
+    SUCCESS = "success",
+    ERROR = "error",
+    WARNING = "warning",
+    ADD = "add",
+    CUSTOM = "custom"
+}
+export interface IconProps {
+    variants: IconVariants;
+    size?: "small" | "medium" | "large";
+    customIcon?: React.ReactNode;
+}

package/dist/typescript/components/Title/components/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./icon";
+export * from "./marker";

package/dist/typescript/components/Title/components/marker/index.d.ts

@@ -0,0 +1,2 @@
+import type { MarkerProps } from "./types";
+export declare function Marker(props: MarkerProps): import("react/jsx-runtime").JSX.Element;

package/dist/typescript/components/Title/components/marker/types.d.ts

@@ -0,0 +1,4 @@
+export interface MarkerProps {
+    size?: "small" | "medium";
+    color?: "pear" | "java" | "grape" | "pitaya" | "tangerine" | "mango" | "blackberry" | "chia" | "ghost";
+}

package/dist/typescript/components/Title/index.d.ts

@@ -0,0 +1,7 @@
+import type { TitleProps } from "./types";
+declare function Title(props: TitleProps): import("react/jsx-runtime").JSX.Element;
+declare namespace Title {
+    var Icon: typeof import("./components").Icon;
+    var Marker: typeof import("./components").Marker;
+}
+export { Title };

package/dist/typescript/components/Title/types.d.ts

@@ -0,0 +1,7 @@
+import type React from "react";
+export interface TitleProps {
+    children: React.ReactNode;
+    className?: string;
+    variant?: "2xlarge" | "xlarge" | "large" | "medium" | "small" | "xsmall";
+    head: React.ReactNode;
+}

package/dist/typescript/components/Toggle/assets/class-variants.d.ts

@@ -0,0 +1,6 @@
+declare const toggleVariants: (props?: ({
+    variant?: "grape" | "java" | "pear" | "tangerine" | "chia" | null | undefined;
+    checked?: boolean | null | undefined;
+    disabled?: boolean | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export { toggleVariants };

package/dist/typescript/components/Toggle/enums/index.d.ts

@@ -0,0 +1 @@
+export * from "./variant";

package/dist/typescript/components/Toggle/enums/variant.d.ts

@@ -0,0 +1,7 @@
+export declare enum VariantEnum {
+    GRAPE = "grape",
+    JAVA = "java",
+    PEAR = "pear",
+    TANGERINE = "tangerine",
+    CHIA = "chia"
+}

package/dist/typescript/components/Toggle/index.d.ts

@@ -0,0 +1,2 @@
+import type { ToggleProps } from "./types";
+export declare function Toggle(props: ToggleProps): import("react/jsx-runtime").JSX.Element;

package/dist/typescript/components/Toggle/types.d.ts

@@ -0,0 +1,7 @@
+import type { VariantEnum } from "./enums";
+export interface ToggleProps {
+    checked: boolean;
+    disabled?: boolean;
+    variant?: VariantEnum;
+    onChange: (checked: boolean) => void;
+}

package/dist/typescript/components/Typography/index.d.ts

@@ -0,0 +1,27 @@
+import React from "react";
+import type { TypographyProps } from "./types";
+/**
+ * Universal Typography component for React Native.
+ *
+ * This component provides:
+ * - Type-safe access to all typography variants from your design tokens
+ * - Automatic font-family mapping based on font weight
+ * - NativeWind className support for additional styling
+ * - Consistent typography across your React Native app
+ *
+ * @example
+ * // Display text with automatic font mapping
+ * <Typography variant="text-display_large_700">Hero Title</Typography>
+ *
+ * @example
+ * // Body text with medium weight
+ * <Typography variant="text-body_medium_500">Content text</Typography>
+ *
+ * @example
+ * // With additional styling
+ * <Typography variant="text-label_small_300" className="text-gray-600">
+ *   Form label
+ * </Typography>
+ */
+export declare const Typography: React.FC<TypographyProps>;
+export default Typography;

package/dist/typescript/components/Typography/types.d.ts

@@ -0,0 +1,7 @@
+import type { TextProps as RNTextProps } from "react-native";
+import type { TypographyVariant } from "@butterfly/tailwind-preset";
+export interface TypographyProps extends Omit<RNTextProps, "children"> {
+    variant: TypographyVariant;
+    className?: string;
+    children: React.ReactNode;
+}

package/dist/typescript/components/index.d.ts

@@ -0,0 +1,11 @@
+export * from "./Button";
+export * from "./Chip";
+export * from "./InformationStatus";
+export * from "./InputCheckbox";
+export * from "./InputOTP";
+export * from "./HighlightedText";
+export * from "./LoadingDots";
+export * from "./Seal";
+export * from "./Title";
+export * from "./Toggle";
+export * from "./Typography";

package/dist/typescript/hooks/index.d.ts

@@ -0,0 +1 @@
+export * from "./use-fonts";

package/dist/typescript/hooks/use-fonts.d.ts

@@ -0,0 +1,10 @@
+/**
+ * A hook to load the custom fonts for the design system.
+ * This should be used in the root component of the application (e.g., App.tsx).
+ *
+ * @returns A boolean indicating if the fonts have been loaded, and an error object if one occurred.
+ */
+export declare const useBrandFonts: () => {
+    fontsLoaded: boolean;
+    fontError: Error | null;
+};

package/dist/typescript/iconography/Icons/index.d.ts

@@ -0,0 +1,2 @@
+import type { IconsProps } from './types';
+export declare function Icons(props: IconsProps): import("react/jsx-runtime").JSX.Element;

package/dist/typescript/iconography/Icons/types.d.ts

@@ -0,0 +1,11 @@
+import { SvgProps } from "react-native-svg";
+export interface IconProps extends SvgProps {
+    size?: number;
+    color?: string;
+    name?: string;
+}
+export interface IconsProps {
+    size?: number;
+    color?: string;
+    icons?: IconProps[];
+}

package/dist/typescript/index.d.ts

@@ -0,0 +1 @@
+export * from "./components";

package/index.js

@@ -0,0 +1,6 @@
+import { registerRootComponent } from "expo";
+import "./global.css";
+
+import App from "./App";
+
+registerRootComponent(App);