ripal-ui 1.1.3 → 1.1.33

package/index.d.ts

@@ -0,0 +1,235 @@
+// index.d.ts
+declare module 'ripal-ui' {
+	import * as React from 'react';
+    import { ViewStyle, TextInputProps } from 'react-native';
+
+	type Size = 'sm' | 'md' | 'lg';
+	type Variant = 'primary' | 'secondary' | 'success' | 'warning' | 'danger';
+
+	// Button
+	export interface ButtonProps {
+		children: React.ReactNode;
+        accent?: 'primary' | 'secondary' | 'tertiary';
+        onPress?: () => void;
+        onLongPress?: () => void;
+        color?: string;
+        height?: number;
+        circle?: boolean;
+        justifyContent?: ViewStyle['justifyContent'];
+        style?: ViewStyle;
+        textProps?: Record<string, unknown>;
+	}
+	export const Button: React.FC<ButtonProps>;
+
+    // ColorPicker
+	export interface ColorPickerProps {
+		value?: string;
+        label?: string;
+        onChange?: (color: string) => void;
+	}
+	export const ColorPicker: React.FC<ColorPickerProps>;
+
+	// Input
+	export interface InputProps {
+		value?: string;
+        label?: string | null;
+        left?: React.ReactNode | null; // Allows for any valid React node
+        right?: React.ReactNode | null; // Allows for any valid React node
+        height?: number;
+        placeholder?: string | null;
+        mode?: TextInputProps["keyboardType"]; // Use keyboardType from TextInputProps
+        secureTextEntry?: boolean;
+        multiline?: boolean;
+        gap?: number;
+        onChangeText: (text: string) => void; // Function to handle text changes
+	}
+	export const Input: React.FC<InputProps>;
+
+    // ProgressBar
+	export interface ProgressBarProps {
+		value: number;
+        from?: number;
+        size?: number;
+        style?: ViewStyle;
+        percentage?: number | null;
+	}
+	export const ProgressBar: React.FC<ProgressBarProps>;
+
+    // Separator
+	export interface SeparatorProps {
+		width?: any;
+        space?: number;
+        height?: number;
+        color?: string;
+        textProps?: React.ComponentProps<typeof Text>;
+        style?: ViewStyle;
+        children?: React.ReactNode;
+	}
+	export const Separator: React.FC<SeparatorProps>;
+
+	// Checkbox
+	export interface CheckboxProps {
+		checked?: boolean;
+		onChange?: (checked: boolean) => void;
+		label?: string;
+		disabled?: boolean;
+	}
+	export const Checkbox: React.FC<CheckboxProps>;
+
+	// Text
+	export interface TextProps {
+		children: React.ReactNode;
+        weight?: '300Light' | '400Regular' | '500Medium' | '600SemiBold' | '700Bold' | '900Black';
+        size?: number;
+        color?: string;
+        align?: 'left' | 'right' | 'center' | 'justify';
+        limit?: number;
+        spacing?: number;
+        lineHeight?: number | null;
+        style?: TextStyle;
+	}
+	export const Text: React.FC<TextProps>;
+
+	// Circle
+	export interface CircleProps {
+		size?: number;
+		color?: string;
+		children?: React.ReactNode;
+	}
+	export const Circle: React.FC<CircleProps>;
+
+	// Row
+	export interface RowProps {
+		children?: React.ReactNode;
+		justify?: 'start' | 'center' | 'end' | 'between' | 'around';
+		align?: 'start' | 'center' | 'end' | 'stretch';
+		gap?: number;
+		className?: string;
+	}
+	export const Row: React.FC<RowProps>;
+
+	// Inline
+	export interface InlineProps {
+		children: React.ReactNode;
+        alignItems?: "flex-start" | "flex-end" | "center" | "baseline" | "stretch";
+        justifyContent?: "flex-start" | "flex-end" | "center" | "space-between" | "space-around" | "space-evenly";
+        gap?: number;
+        style?: ViewStyle;
+	}
+	export const Inline: React.FC<InlineProps>;
+
+	// Cell
+	export interface CellProps {
+		children?: React.ReactNode;
+		width?: number | string;
+	}
+	export const Cell: React.FC<CellProps>;
+
+	// // BottomSheet
+	// export interface BottomSheetProps {
+	// 	open: boolean;
+	// 	onClose: () => void;
+	// 	children?: React.ReactNode;
+	// }
+	// export const BottomSheet: React.FC<BottomSheetProps>;
+
+	// Skeleton
+	export interface SkeletonProps {
+		color?: string;
+        rounded?: number;
+        width?: any;
+        height?: number;
+        aspectRatio?: number | null;
+	}
+	export const Skeleton: React.FC<SkeletonProps>;
+
+    // Slider
+	export interface SliderProps {
+		start?: number;
+        end?: number;
+        value?: number;
+        rounded?: number;
+        trackColor?: string;
+        color?: string;
+        height?: number;
+        thumbOpacity?: number;
+        thumbColor?: string;
+        onChange?: (value: number) => void;
+        setScrollEnabled?: (enabled: boolean) => void;
+	}
+	export const Slider: React.FC<SliderProps>;
+
+    // Switch
+	export interface SwitchProps {
+		active?: boolean;
+        size?: number;
+        spacer?: number;
+        onChange?: () => void;
+	}
+	export const Switch: React.FC<SwitchProps>;
+
+	// Dialog
+	export interface DialogProps {
+		spacer?: number;
+        children: React.ReactNode;
+        visible: boolean;
+        onDismiss: () => void;
+	}
+	export const Dialog: React.FC<DialogProps>;
+
+    // DialogActions
+	export interface DialogActionsProps {
+		children: React.ReactNode;
+	}
+	export const DialogActions: React.FC<DialogActionsProps>;
+
+    type OptionType<T> = T[] | string[];
+
+	export interface DropdownProps<T> {
+		options: OptionType<T>;
+		value: T | null;
+		setValue: (value: T) => void;
+		onChange?: (value: T) => void;
+		color?: string;
+		label?: string | null;
+		placeholder?: string;
+		objectKey?: keyof T | null;
+		withSearch?: boolean;
+	}
+
+	// Generic component declaration
+	export function Dropdown<T>(props: DropdownProps<T>): React.ReactElement;
+
+    // Toast
+	export interface ToastProps {
+		label?: string;
+        color?: string;
+        right?: React.ReactNode; // Allows for any valid React node
+        visible?: boolean;
+        onDismiss: () => void;
+        timeout?: number;
+        containerStyle?: ViewStyle; // Style for the container View
+        style?: ViewStyle; // Additional style for the Toast
+        textProps?: React.ComponentProps<typeof Text>; // Props for the Text component
+	}
+	export const Toast: React.FC<ToastProps>;
+
+    // Toggle
+	export interface ToggleProps {
+		options: string[];
+        value: any;
+        setValue: (value: string) => void;
+	}
+	export const Toggle: React.FC<ToggleProps>;
+
+	// // Table
+	// export interface TableProps<T = any> {
+	// 	data: T[];
+	// 	columns: {
+	// 		title: string;
+	// 		key: keyof T;
+	// 		render?: (row: T) => React.ReactNode;
+	// 	}[];
+	// }
+	// export const Table: React.FC<TableProps>;
+}

package/package.json

@@ -1,8 +1,9 @@
 {
   "name": "ripal-ui",
-  "version": "1.1.3",
+  "version": "1.1.33",
   "description": "A collection of React elements and components",
   "main": "index.js",
+  "types": "index.d.ts",
   "scripts": {
     "build": "babel elements components --out-dir dist",
     "postinstall": "node ./scripts/generateConfig.js"