@nexara/nativeflow 0.1.1

package/lib/typescript/module/src/types/menu.type.d.ts

@@ -0,0 +1,90 @@
+import type { ReactNode } from "react";
+import type { StyleProp, TextStyle, TouchableOpacityProps, ViewStyle } from "react-native";
+import type { TypographyVariant } from "./common.type";
+export type MenuProps = {
+    /**
+     * Defines the placement of the menu relative to the anchor element.
+     * Options: 'top' | 'bottom'.
+     */
+    placement?: 'top' | 'bottom';
+    /**
+     * The element that triggers the menu when interacted with.
+     */
+    anchor?: JSX.Element;
+    /**
+     * Disables the built-in state management of the menu.
+     * If true, you must control the open state manually.
+     */
+    disableBuiltInState?: boolean;
+    /**
+     * Controls whether the menu is open.
+     * Used when `disableBuiltInState` is true.
+     */
+    isOpen?: boolean;
+    /**
+     * Callback triggered when the menu is requested to open.
+     */
+    onRequestOpen?: () => void;
+    /**
+     * Callback triggered when the menu is requested to close.
+     */
+    onRequestClose?: () => void;
+    /**
+     * Callback triggered when an item is selected.
+     * Receives the name of the selected item.
+     */
+    onSelect?: (name: string | undefined) => void;
+    /**
+     * Custom styles for the menu container.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Child components to be rendered inside the menu.
+     */
+    children?: ReactNode;
+};
+export type MenuItemProps = TouchableOpacityProps & {
+    /**
+     * Vertical padding inside the menu item.
+     */
+    paddingV?: number;
+    /**
+     * Horizontal padding inside the menu item.
+     */
+    paddingH?: number;
+    /**
+     * Space between elements inside the menu item.
+     */
+    gap?: number;
+    /**
+     * The name or identifier of the menu item.
+     */
+    name?: string;
+    /**
+     * Custom styles for the menu item container.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Child components to be rendered inside the menu item.
+     */
+    children?: ReactNode;
+};
+export type MenuItemLabelProps = TextStyle & {
+    /**
+     * Font size of the label text.
+     */
+    fs?: number;
+    /**
+     * Typography variant for the label text.
+     */
+    textVariant?: TypographyVariant;
+    /**
+     * Custom styles for the text component.
+     */
+    style?: StyleProp<TextStyle>;
+    /**
+     * Text to be displayed inside the label.
+     */
+    children?: ReactNode;
+};
+//# sourceMappingURL=menu.type.d.ts.map

package/lib/typescript/module/src/types/menu.type.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu.type.d.ts","sourceRoot":"","sources":["../../../../../src/types/menu.type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAC3F,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAGvD,MAAM,MAAM,SAAS,GAAG;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IAE7B;;OAEG;IACH,MAAM,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAErB;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAE3B;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAE5B;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;IAE9C;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAE7B;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACxB,CAAC;AAGF,MAAM,MAAM,aAAa,GAAG,qBAAqB,GAAG;IAChD;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAE7B;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACxB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,SAAS,GAAG;IACzC;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ;;OAEG;IACH,WAAW,CAAC,EAAE,iBAAiB,CAAC;IAEhC;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAE7B;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACxB,CAAC"}

package/lib/typescript/module/src/types/stack.type.d.ts

@@ -0,0 +1,46 @@
+import type { FlexStyle, StyleProp, ViewStyle } from "react-native";
+export type HStackProps = ViewStyle & {
+    /**
+     * Defines the alignment of children along the main axis.
+     */
+    justify?: FlexStyle['justifyContent'];
+    /**
+     * Defines the alignment of children along the cross axis.
+     */
+    align?: FlexStyle['alignItems'];
+    /**
+     * Determines whether the items should wrap onto multiple lines.
+     */
+    fWrap?: FlexStyle['flexWrap'];
+    /**
+     * Space between child components.
+     */
+    gap?: number;
+    /**
+     * Custom styles for the container.
+     */
+    containerStyle?: StyleProp<ViewStyle>;
+    /**
+     * Child components to be rendered inside the HStack.
+     */
+    children?: React.ReactNode;
+};
+export type VStackProps = ViewStyle & {
+    /**
+     * Child components to be rendered inside the VStack.
+     */
+    children?: React.ReactNode;
+    /**
+     * Defines the alignment of children along the cross axis.
+     */
+    align?: FlexStyle['alignItems'];
+    /**
+     * Space between child components.
+     */
+    gap?: number;
+    /**
+     * Custom styles for the container.
+     */
+    containerStyle?: StyleProp<ViewStyle>;
+};
+//# sourceMappingURL=stack.type.d.ts.map

package/lib/typescript/module/src/types/stack.type.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stack.type.d.ts","sourceRoot":"","sources":["../../../../../src/types/stack.type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEpE,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG;IAClC;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAEtC;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC,CAAC;IAEhC;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,UAAU,CAAC,CAAC;IAE9B;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;OAEG;IACH,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAEtC;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC9B,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG;IAClC;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC,CAAC;IAEhC;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;OAEG;IACH,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CACzC,CAAC"}

package/lib/typescript/module/src/types/styledComponents.type.d.ts

@@ -0,0 +1,91 @@
+import type { ColorValue, DimensionValue, StyleProp, TextProps, TextStyle, ViewProps, ViewStyle } from "react-native";
+import type { TypographyVariant } from "./common.type";
+export type StyledViewProps = ViewStyle & ViewProps & {
+    /**
+     * Flex value to control the flex growth, shrink, and basis of the view.
+     */
+    f?: number;
+    /**
+     * Defines how children are aligned along the main axis.
+     */
+    justify?: ViewStyle['justifyContent'];
+    /**
+     * Defines how children are aligned along the cross axis.
+     */
+    align?: ViewStyle['alignItems'];
+    /**
+     * Determines whether the children should wrap if they exceed the container size.
+     */
+    fWrap?: ViewStyle['flexWrap'];
+    /**
+     * Background color of the view.
+     */
+    bg?: string;
+    /**
+     * Whether the background color should be derived from the theme.
+     */
+    themeBg?: boolean;
+    /**
+     * Height of the view, can be a number or a percentage string.
+     */
+    h?: DimensionValue;
+    /**
+     * Width of the view, can be a number or a percentage string.
+     */
+    w?: DimensionValue;
+    /**
+     * Child components to be rendered inside StyledView.
+     */
+    children?: React.ReactNode;
+    /**
+     * Custom styles for the view component.
+     */
+    style?: StyleProp<ViewStyle>;
+};
+export type StyledTextProps = TextProps & {
+    /**
+     * Defines the typography variant for the text.
+     */
+    variant?: TypographyVariant;
+    /**
+     * Text content to be rendered inside StyledText.
+     */
+    children?: React.ReactNode;
+    /**
+     * Custom styles for the text component.
+     */
+    style?: StyleProp<TextStyle>;
+    /**
+     * Font family for the text.
+     */
+    ff?: string;
+    /**
+     * Font size of the text.
+     */
+    fs?: number;
+    /**
+     * Font weight of the text.
+     */
+    fw?: TextStyle['fontWeight'];
+    /**
+     * Whether the text should be automatically capitalized or adjusted based on the theme.
+     */
+    tas?: boolean;
+    /**
+     * Color of the text. Accepts standard color values.
+     */
+    color?: ColorValue;
+    /**
+     * Whether the text color should be derived from the theme.
+     */
+    themeColor?: boolean;
+    /**
+     * Whether the text should use the primary theme color.
+     */
+    primary?: boolean;
+    /**
+     * Whether the text should use the secondary theme color.
+     */
+    secondary?: boolean;
+};
+//# sourceMappingURL=styledComponents.type.d.ts.map

package/lib/typescript/module/src/types/styledComponents.type.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styledComponents.type.d.ts","sourceRoot":"","sources":["../../../../../src/types/styledComponents.type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACtH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAEvD,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,SAAS,GAAG;IAClD;;OAEG;IACH,CAAC,CAAC,EAAE,MAAM,CAAC;IAEX;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAEtC;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC,CAAC;IAEhC;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,UAAU,CAAC,CAAC;IAE9B;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;OAEG;IACH,CAAC,CAAC,EAAE,cAAc,CAAC;IAEnB;;OAEG;IACH,CAAC,CAAC,EAAE,cAAc,CAAC;IAEnB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG;IACtC;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAE5B;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAE7B;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ;;OAEG;IACH,EAAE,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC,CAAC;IAE7B;;OAEG;IACH,GAAG,CAAC,EAAE,OAAO,CAAC;IAEd;;OAEG;IACH,KAAK,CAAC,EAAE,UAAU,CAAC;IAEnB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC"}

package/lib/typescript/module/src/types/switch.type.d.ts

@@ -0,0 +1,33 @@
+import type { SwitchProps as NativeSwitchProps } from "react-native";
+export type SwitchProps = NativeSwitchProps & {
+    /**
+     * Determines whether the switch is turned on or off.
+     */
+    checked?: boolean;
+    /**
+     * The color of the switch thumb.
+     */
+    color?: string;
+    /**
+     * If true, the switch will be disabled and not interactable.
+     */
+    disabled?: boolean;
+    /**
+     * The size of the switch thumb and track.
+     */
+    size?: number;
+    /**
+     * The color of the track when the switch is in the "on" position.
+     */
+    activeTrackColor?: string;
+    /**
+     * The color of the track when the switch is in the "off" position.
+     */
+    inactiveTrackColor?: string;
+    /**
+     * Callback function triggered when the switch state changes.
+     * @param newValue - The updated boolean value of the switch.
+     */
+    onChange?: (newValue: boolean) => void;
+};
+//# sourceMappingURL=switch.type.d.ts.map

package/lib/typescript/module/src/types/switch.type.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch.type.d.ts","sourceRoot":"","sources":["../../../../../src/types/switch.type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,IAAI,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAErE,MAAM,MAAM,WAAW,GAAG,iBAAiB,GAAG;IAC1C;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C,CAAC"}

package/lib/typescript/module/src/types/userInput.type.d.ts

@@ -0,0 +1,74 @@
+import type { StyleProp, TextInputProps, TextStyle, ViewStyle } from "react-native";
+import type { TypographyVariant, UserInputVariant } from "./common.type";
+export type UserInputProps = TextInputProps & {
+    /**
+     * Defines the input style variant.
+     * - 'outlined': Input has a border around it.
+     * - 'standard': Only the bottom border is visible.
+     * @default 'standard'
+     */
+    variant?: UserInputVariant;
+    /** Label text displayed above the input field. */
+    label?: string;
+    /** Background color of the input container. */
+    bg?: string;
+    /** Border radius of the input field. */
+    br?: number;
+    /** Border stroke width (thickness). */
+    stroke?: number;
+    /** Color of the label text. */
+    labelColor?: string;
+    /**
+     * Defines typography styles for text elements.
+     * - `label`: Typography variant for the label.
+     * - `helperText`: Typography variant for the helper text.
+     */
+    textVariant?: {
+        label?: TypographyVariant;
+        helperText?: TypographyVariant;
+    };
+    /** Color of the text inside the input field. */
+    inputTextColor?: string;
+    /** Border color of the input field. */
+    strokeColor?: string;
+    /** Cursor color when typing in the input field. */
+    cursorColor?: string;
+    /** Color of the placeholder text. */
+    placeholderColor?: string;
+    /** Font size of the input text. */
+    inputFs?: number;
+    /** Font size of the label text. */
+    labelFs?: number;
+    /** Font size of the helper text. */
+    helperTextFS?: number;
+    /** Placeholder text displayed when input is empty. */
+    placeholder?: string;
+    /** If `true`, the input field is marked as an error (e.g., invalid input). */
+    isError?: boolean;
+    /** Helper text displayed below the input field (e.g., validation message). */
+    helperText?: string;
+    /** If `true`, the input field is disabled and cannot be interacted with. */
+    disabled?: boolean;
+    /** If `true`, the input field allows multiple lines of text. */
+    multiline?: boolean;
+    /** Renders a custom left icon inside the input field. */
+    renderLeftIcon?: JSX.Element;
+    /** Renders a custom right icon inside the input field. */
+    renderRightIcon?: JSX.Element;
+    /**
+     * Custom styles for different parts of the component.
+     * - `mainContainer`: Styles for the outermost wrapper.
+     * - `inputContainer`: Styles for the input field container.
+     * - `input`: Styles for the actual text input.
+     * - `label`: Styles for the label text.
+     * - `helperText`: Styles for the helper text.
+     */
+    styles?: {
+        mainContainer?: StyleProp<ViewStyle>;
+        inputContainer?: StyleProp<ViewStyle>;
+        input?: StyleProp<TextStyle>;
+        label?: StyleProp<TextStyle>;
+        helperText?: StyleProp<TextStyle>;
+    };
+};
+//# sourceMappingURL=userInput.type.d.ts.map

package/lib/typescript/module/src/types/userInput.type.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"userInput.type.d.ts","sourceRoot":"","sources":["../../../../../src/types/userInput.type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACpF,OAAO,KAAK,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAEzE,MAAM,MAAM,cAAc,GAAG,cAAc,GAAG;IAC1C;;;;;OAKG;IACH,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAE3B,kDAAkD;IAClD,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,+CAA+C;IAC/C,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ,wCAAwC;IACxC,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ,uCAAuC;IACvC,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,+BAA+B;IAC/B,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;;;OAIG;IACH,WAAW,CAAC,EAAE;QACV,KAAK,CAAC,EAAE,iBAAiB,CAAC;QAC1B,UAAU,CAAC,EAAE,iBAAiB,CAAC;KAClC,CAAC;IAEF,gDAAgD;IAChD,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,uCAAuC;IACvC,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,mDAAmD;IACnD,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,qCAAqC;IACrC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B,mCAAmC;IACnC,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,mCAAmC;IACnC,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,oCAAoC;IACpC,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,sDAAsD;IACtD,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,8EAA8E;IAC9E,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,8EAA8E;IAC9E,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,4EAA4E;IAC5E,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,gEAAgE;IAChE,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,yDAAyD;IACzD,cAAc,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAE7B,0DAA0D;IAC1D,eAAe,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAE9B;;;;;;;OAOG;IACH,MAAM,CAAC,EAAE;QACL,aAAa,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QACrC,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QACtC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC7B,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC7B,UAAU,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;KACrC,CAAC;CACL,CAAC"}

package/package.json

@@ -0,0 +1,197 @@
+{
+  "name": "@nexara/nativeflow",
+  "version": "0.1.1",
+  "description": "Beautiful, responsive, and customizable UI components for React Native – built for performance and seamless experiences.",
+  "source": "./src/index.ts",
+  "main": "./lib/commonjs/index.js",
+  "module": "./lib/module/index.js",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./lib/typescript/module/src/index.d.ts",
+        "default": "./lib/module/index.js"
+      },
+      "require": {
+        "types": "./lib/typescript/commonjs/src/index.d.ts",
+        "default": "./lib/commonjs/index.js"
+      }
+    }
+  },
+  "files": [
+    "src",
+    "lib",
+    "android",
+    "ios",
+    "cpp",
+    "*.podspec",
+    "react-native.config.js",
+    "!ios/build",
+    "!android/build",
+    "!android/gradle",
+    "!android/gradlew",
+    "!android/gradlew.bat",
+    "!android/local.properties",
+    "!**/__tests__",
+    "!**/__fixtures__",
+    "!**/__mocks__",
+    "!**/.*"
+  ],
+  "scripts": {
+    "example": "yarn workspace @nexara/nativeflow-example",
+    "test": "jest",
+    "typecheck": "tsc",
+    "lint": "eslint \"**/*.{js,ts,tsx}\"",
+    "clean": "del-cli lib",
+    "prepare": "bob build",
+    "release": "release-it"
+  },
+  "keywords": [
+    "react-native",
+    "ios",
+    "android"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/Yash-dott/nexara-nativeflow.git"
+  },
+  "author": "yash <yashkumarjha20@gmail.com> (https://github.com/Yash-dott)",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/Yash-dott/nexara-nativeflow/issues"
+  },
+  "homepage": "https://nexara-nativeflow-docs.onrender.com",
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/",
+    "access": "public"
+  },
+  "devDependencies": {
+    "@babel/plugin-proposal-export-namespace-from": "^7.18.9",
+    "@commitlint/config-conventional": "^17.0.2",
+    "@evilmartians/lefthook": "^1.5.0",
+    "@react-native/eslint-config": "^0.73.1",
+    "@release-it/conventional-changelog": "^9.0.2",
+    "@types/jest": "^29.5.5",
+    "@types/react": "^18.2.44",
+    "commitlint": "^17.0.2",
+    "del-cli": "^5.1.0",
+    "eslint": "^8.51.0",
+    "eslint-config-prettier": "^9.0.0",
+    "eslint-plugin-prettier": "^5.0.1",
+    "jest": "^29.7.0",
+    "prettier": "^3.0.3",
+    "react": "18.3.1",
+    "react-native": "0.76.7",
+    "react-native-builder-bob": "^0.36.0",
+    "react-native-gesture-handler": "^2.24.0",
+    "react-native-reanimated": "~3.16.1",
+    "react-native-svg": "^15.11.2",
+    "release-it": "^17.10.0",
+    "typescript": "^5.2.2"
+  },
+  "resolutions": {
+    "@types/react": "^18.2.44"
+  },
+  "peerDependencies": {
+    "react": "*",
+    "react-native": "*",
+    "react-native-reanimated": "~3.16.1"
+  },
+  "workspaces": [
+    "example"
+  ],
+  "packageManager": "yarn@3.6.1",
+  "jest": {
+    "preset": "react-native",
+    "modulePathIgnorePatterns": [
+      "<rootDir>/example/node_modules",
+      "<rootDir>/lib/"
+    ]
+  },
+  "commitlint": {
+    "extends": [
+      "@commitlint/config-conventional"
+    ]
+  },
+  "release-it": {
+    "git": {
+      "commitMessage": "chore: release ${version}",
+      "tagName": "v${version}"
+    },
+    "npm": {
+      "publish": true
+    },
+    "github": {
+      "release": true
+    },
+    "plugins": {
+      "@release-it/conventional-changelog": {
+        "preset": "angular"
+      }
+    }
+  },
+  "eslintConfig": {
+    "root": true,
+    "extends": [
+      "@react-native",
+      "prettier"
+    ],
+    "rules": {
+      "react/react-in-jsx-scope": "off",
+      "prettier/prettier": [
+        "error",
+        {
+          "quoteProps": "consistent",
+          "singleQuote": true,
+          "tabWidth": 2,
+          "trailingComma": "es5",
+          "useTabs": false
+        }
+      ]
+    }
+  },
+  "eslintIgnore": [
+    "node_modules/",
+    "lib/"
+  ],
+  "prettier": {
+    "quoteProps": "consistent",
+    "singleQuote": true,
+    "tabWidth": 2,
+    "trailingComma": "es5",
+    "useTabs": false
+  },
+  "react-native-builder-bob": {
+    "source": "src",
+    "output": "lib",
+    "targets": [
+      [
+        "commonjs",
+        {
+          "esm": true
+        }
+      ],
+      [
+        "module",
+        {
+          "esm": true
+        }
+      ],
+      [
+        "typescript",
+        {
+          "project": "tsconfig.build.json",
+          "esm": true
+        }
+      ]
+    ]
+  },
+  "create-react-native-library": {
+    "languages": "js",
+    "type": "library",
+    "version": "0.48.3"
+  },
+  "dependencies": {
+    "color": "^5.0.0",
+    "lucide-react-native": "^0.479.0"
+  }
+}

package/src/assets/svg/Check.tsx

@@ -0,0 +1,17 @@
+import { Path, Svg } from "react-native-svg";
+
+const Check = ({ size = 24, color = '#000' }) => {
+    return (<>
+        <Svg
+            height={size}
+            viewBox="0 -960 960 960"
+            width={size}
+            fill={color}
+        >
+            <Path  d="M382-240 154-468l57-57 171 171 367-367 57 57-424 424Z" />
+        </Svg>
+
+    </>);
+}
+
+export default Check;

package/src/assets/svg/X.tsx

@@ -0,0 +1,16 @@
+import { Path, Svg } from "react-native-svg";
+
+const X = ({ size = 24, color = '#000' }) => {
+    return (
+        <Svg
+            height={size}
+            viewBox="0 -960 960 960"
+            width={size}
+            fill={color}
+        >
+            <Path d="m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z" />
+        </Svg>
+    );
+}
+
+export default X;

package/src/assets/svg/index.ts

@@ -0,0 +1,2 @@
+export { default as X } from './X';
+export { default as Check } from './Check';

package/src/components/Avatar/AvatarImage.tsx

@@ -0,0 +1,39 @@
+import React from "react";
+import { Image } from "react-native";
+import { StyledView } from "../StyledComponents";
+import { verticalScale } from "../../helpers/ResponsiveCalculations";
+import { useTheme } from "../../hooks";
+import type { AvatarImageProps } from "../../types";
+
+
+const AvatarImage: React.FC<AvatarImageProps> = ({
+    size = 70,
+    source,
+    bg,
+    resizeMode = 'cover',
+    containerStyle,
+    imageStyle
+}) => {
+
+    const theme: any = useTheme();
+
+    return (<>
+        <StyledView
+            backgroundColor={bg ?? theme.colors.primary}
+            // alignSelf='flex-start'
+            height={verticalScale(size)}
+            width={verticalScale(size)}
+            borderRadius={verticalScale(size)}
+            overflow='hidden'
+            style={containerStyle}
+        >
+            <Image
+                source={source}
+                style={[{ height: '100%', width: '100%' }, imageStyle]}
+                resizeMode={resizeMode}
+            />
+        </StyledView>
+    </>)
+}
+export default AvatarImage;
+export type { AvatarImageProps };

package/src/components/Avatar/AvatarText.tsx

@@ -0,0 +1,35 @@
+import React from "react";
+import { StyledText, StyledView } from "../StyledComponents";
+import { verticalScale } from "../../helpers/ResponsiveCalculations";
+import { useTheme } from "../../hooks";
+import type { AvatarTextProps } from "../../types";
+
+
+const AvatarText: React.FC<AvatarTextProps> = ({
+    size = 70,
+    fs,
+    text = 'YH',
+    bg,
+    containerStyle,
+    textStyle,
+}) => {
+    text = text.slice(0, 2).toUpperCase();
+    const theme: any = useTheme();
+
+    return (<>
+        <StyledView
+            bg={bg ?? theme.colors.primary}
+            // alignSelf='flex-start'
+            h={verticalScale(size)}
+            w={verticalScale(size)}
+            align='center'
+            justify='center'
+            borderRadius={verticalScale(size)}
+            style={containerStyle}
+        >
+            <StyledText secondary fw='bold' fs={fs ?? (size / 3)} style={textStyle}>{text}</StyledText>
+        </StyledView>
+    </>)
+}
+export default AvatarText;
+export type { AvatarTextProps };

package/src/components/Avatar/index.ts

@@ -0,0 +1,9 @@
+import AvatarImage from "./AvatarImage";
+import AvatarText from "./AvatarText";
+const Avatar = {
+    Image: AvatarImage,
+    Text: AvatarText
+};
+export type { AvatarImageProps } from './AvatarImage';
+export type { AvatarTextProps } from './AvatarText';
+export default Avatar;