@streamplace/components 0.7.0 → 0.7.2

package/dist/components/ui/dropdown.js

@@ -1,148 +1,153 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import BottomSheet, { BottomSheetView } from "@gorhom/bottom-sheet";
-import * as DropdownMenuPrimitive from "@rn-primitives/dropdown-menu";
-import { Check, CheckCircle, ChevronDown, ChevronRight, ChevronUp, Circle, } from "lucide-react-native";
-import { forwardRef, useMemo, useRef } from "react";
-import { Platform, Pressable, StyleSheet, Text, useWindowDimensions, View, } from "react-native";
-import { a, bg, borderRadius, colors, fontSize, gap, h, layout, ml, mt, mx, p, pb, pl, pr, pt, px, py, right, textColors, } from "../../lib/theme/atoms";
-import { objectFromObjects, TextContext as TextClassContext, } from "./primitives/text";
-export const DropdownMenu = DropdownMenuPrimitive.Root;
-export const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
-export const DropdownMenuPortal = DropdownMenuPrimitive.Portal;
-export const DropdownMenuSub = DropdownMenuPrimitive.Sub;
-export const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
-export const DropdownMenuBottomSheet = forwardRef(function DropdownMenuBottomSheet({ overlayStyle, portalHost, children }, _ref) {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DropdownMenuInfo = exports.DropdownMenuGroup = exports.DropdownMenuSeparator = exports.DropdownMenuLabel = exports.DropdownMenuRadioItem = exports.DropdownMenuCheckboxItem = exports.DropdownMenuItem = exports.ResponsiveDropdownMenuContent = exports.DropdownMenuContent = exports.DropdownMenuSubContent = exports.DropdownMenuSubTrigger = exports.DropdownMenuBottomSheet = exports.DropdownMenuRadioGroup = exports.DropdownMenuSub = exports.DropdownMenuPortal = exports.DropdownMenuTrigger = exports.DropdownMenu = void 0;
+exports.DropdownMenuShortcut = DropdownMenuShortcut;
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const bottom_sheet_1 = tslib_1.__importStar(require("@gorhom/bottom-sheet"));
+const DropdownMenuPrimitive = tslib_1.__importStar(require("@rn-primitives/dropdown-menu"));
+const lucide_react_native_1 = require("lucide-react-native");
+const react_1 = require("react");
+const react_native_1 = require("react-native");
+const atoms_1 = require("../../lib/theme/atoms");
+const text_1 = require("./primitives/text");
+exports.DropdownMenu = DropdownMenuPrimitive.Root;
+exports.DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
+exports.DropdownMenuPortal = DropdownMenuPrimitive.Portal;
+exports.DropdownMenuSub = DropdownMenuPrimitive.Sub;
+exports.DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
+exports.DropdownMenuBottomSheet = (0, react_1.forwardRef)(function DropdownMenuBottomSheet({ overlayStyle, portalHost, children }, _ref) {
     // Use the primitives' context to know if open
     const { open, onOpenChange } = DropdownMenuPrimitive.useRootContext();
-    const snapPoints = useMemo(() => ["25%", "50%", "80%"], []);
-    const sheetRef = useRef(null);
-    return (_jsx(DropdownMenuPrimitive.Portal, { hostName: portalHost, children: _jsx(BottomSheet, { ref: sheetRef, 
+    const snapPoints = (0, react_1.useMemo)(() => ["25%", "50%", "80%"], []);
+    const sheetRef = (0, react_1.useRef)(null);
+    return ((0, jsx_runtime_1.jsx)(DropdownMenuPrimitive.Portal, { hostName: portalHost, children: (0, jsx_runtime_1.jsx)(bottom_sheet_1.default, { ref: sheetRef, 
             // why the heck is this 1-indexed
-            index: open ? 3 : -1, snapPoints: snapPoints, enablePanDownToClose: true, onClose: () => onOpenChange?.(false), style: [overlayStyle], backgroundStyle: [bg.black, a.radius.all.md, a.shadows.md, p[1]], handleIndicatorStyle: [
-                a.sizes.width[12],
-                a.sizes.height[1],
-                bg.gray[500],
-            ], children: _jsx(BottomSheetView, { style: [px[2]], children: typeof children === "function"
+            index: open ? 3 : -1, snapPoints: snapPoints, enablePanDownToClose: true, onClose: () => onOpenChange?.(false), style: [overlayStyle], backgroundStyle: [atoms_1.bg.black, atoms_1.a.radius.all.md, atoms_1.a.shadows.md, atoms_1.p[1]], handleIndicatorStyle: [
+                atoms_1.a.sizes.width[12],
+                atoms_1.a.sizes.height[1],
+                atoms_1.bg.gray[500],
+            ], children: (0, jsx_runtime_1.jsx)(bottom_sheet_1.BottomSheetView, { style: [atoms_1.px[2]], children: typeof children === "function"
                     ? children({ pressed: true })
                     : children }) }) }));
 });
-export const DropdownMenuSubTrigger = forwardRef(({ inset, children, ...props }, ref) => {
+exports.DropdownMenuSubTrigger = (0, react_1.forwardRef)(({ inset, children, ...props }, ref) => {
     const { open } = DropdownMenuPrimitive.useSubContext();
-    const Icon = Platform.OS === "web" ? ChevronRight : open ? ChevronUp : ChevronDown;
-    return (_jsx(TextClassContext.Provider, { value: objectFromObjects([
-            a.textColors.primary[500],
-            a.fontSize.base,
-            open && a.textColors.primary[700],
-        ]), children: _jsx(DropdownMenuPrimitive.SubTrigger, { ref: ref, ...props, children: _jsxs(View, { style: [
-                    inset && gap[2],
-                    layout.flex.row,
-                    layout.flex.alignCenter,
-                    p[2],
-                    pr[8],
-                ], children: [children, _jsx(View, { style: [a.layout.position.absolute, a.position.right[1]], children: _jsx(Icon, { size: 18, color: colors.gray[200] }) })] }) }) }));
+    const Icon = react_native_1.Platform.OS === "web" ? lucide_react_native_1.ChevronRight : open ? lucide_react_native_1.ChevronUp : lucide_react_native_1.ChevronDown;
+    return ((0, jsx_runtime_1.jsx)(text_1.TextContext.Provider, { value: (0, text_1.objectFromObjects)([
+            atoms_1.a.textColors.primary[500],
+            atoms_1.a.fontSize.base,
+            open && atoms_1.a.textColors.primary[700],
+        ]), children: (0, jsx_runtime_1.jsx)(DropdownMenuPrimitive.SubTrigger, { ref: ref, ...props, children: (0, jsx_runtime_1.jsxs)(react_native_1.View, { style: [
+                    inset && atoms_1.gap[2],
+                    atoms_1.layout.flex.row,
+                    atoms_1.layout.flex.alignCenter,
+                    atoms_1.p[2],
+                    atoms_1.pr[8],
+                ], children: [children, (0, jsx_runtime_1.jsx)(react_native_1.View, { style: [atoms_1.a.layout.position.absolute, atoms_1.a.position.right[1]], children: (0, jsx_runtime_1.jsx)(Icon, { size: 18, color: atoms_1.colors.gray[200] }) })] }) }) }));
 });
-export const DropdownMenuSubContent = forwardRef((props, ref) => {
-    return (_jsx(DropdownMenuPrimitive.SubContent, { ref: ref, style: [
-            a.zIndex[50],
-            a.sizes.minWidth[32],
-            a.overflow.hidden,
-            a.radius.all.md,
-            a.borders.width.thin,
-            a.borders.color.gray[600],
-            mt[1],
-            bg.black,
-            p[1],
-            a.shadows.md,
+exports.DropdownMenuSubContent = (0, react_1.forwardRef)((props, ref) => {
+    return ((0, jsx_runtime_1.jsx)(DropdownMenuPrimitive.SubContent, { ref: ref, style: [
+            atoms_1.a.zIndex[50],
+            atoms_1.a.sizes.minWidth[32],
+            atoms_1.a.overflow.hidden,
+            atoms_1.a.radius.all.md,
+            atoms_1.a.borders.width.thin,
+            atoms_1.a.borders.color.gray[600],
+            atoms_1.mt[1],
+            atoms_1.bg.black,
+            atoms_1.p[1],
+            atoms_1.a.shadows.md,
         ], ...props }));
 });
-export const DropdownMenuContent = forwardRef(({ overlayStyle, portalHost, ...props }, ref) => {
-    return (_jsx(DropdownMenuPrimitive.Portal, { hostName: portalHost, children: _jsx(DropdownMenuPrimitive.Overlay, { style: [
-                Platform.OS !== "web" ? StyleSheet.absoluteFill : undefined,
+exports.DropdownMenuContent = (0, react_1.forwardRef)(({ overlayStyle, portalHost, ...props }, ref) => {
+    return ((0, jsx_runtime_1.jsx)(DropdownMenuPrimitive.Portal, { hostName: portalHost, children: (0, jsx_runtime_1.jsx)(DropdownMenuPrimitive.Overlay, { style: [
+                react_native_1.Platform.OS !== "web" ? react_native_1.StyleSheet.absoluteFill : undefined,
                 overlayStyle,
-            ], children: _jsx(DropdownMenuPrimitive.Content, { ref: ref, style: [
-                    a.zIndex[50],
-                    a.sizes.minWidth[32],
-                    a.sizes.maxWidth[64],
-                    a.overflow.hidden,
-                    a.radius.all.md,
-                    a.borders.width.thin,
-                    a.borders.color.gray[800],
-                    bg.gray[950],
-                    p[2],
-                    a.shadows.md,
+            ], children: (0, jsx_runtime_1.jsx)(DropdownMenuPrimitive.Content, { ref: ref, style: [
+                    atoms_1.a.zIndex[50],
+                    atoms_1.a.sizes.minWidth[32],
+                    atoms_1.a.sizes.maxWidth[64],
+                    atoms_1.a.overflow.hidden,
+                    atoms_1.a.radius.all.md,
+                    atoms_1.a.borders.width.thin,
+                    atoms_1.a.borders.color.gray[800],
+                    atoms_1.bg.gray[950],
+                    atoms_1.p[2],
+                    atoms_1.a.shadows.md,
                 ], ...props }) }) }));
 });
-export const ResponsiveDropdownMenuContent = forwardRef(({ children, ...props }, ref) => {
-    const { width } = useWindowDimensions();
+exports.ResponsiveDropdownMenuContent = (0, react_1.forwardRef)(({ children, ...props }, ref) => {
+    const { width } = (0, react_native_1.useWindowDimensions)();
     // On web, you might want to always use the normal dropdown
-    const isBottomSheet = Platform.OS !== "web" && width < 800;
+    const isBottomSheet = react_native_1.Platform.OS !== "web" && width < 800;
     if (isBottomSheet) {
-        return (_jsx(DropdownMenuBottomSheet, { ref: ref, ...props, children: children }));
+        return ((0, jsx_runtime_1.jsx)(exports.DropdownMenuBottomSheet, { ref: ref, ...props, children: children }));
     }
-    return (_jsx(DropdownMenuContent, { ref: ref, ...props, children: children }));
+    return ((0, jsx_runtime_1.jsx)(exports.DropdownMenuContent, { ref: ref, ...props, children: children }));
 });
-export const DropdownMenuItem = forwardRef(({ inset, disabled, style, children, ...props }, ref) => {
-    return (_jsx(Pressable, { ...props, children: _jsx(TextClassContext.Provider, { value: objectFromObjects([a.textColors.gray[900], a.fontSize.base]), children: _jsx(View, { style: [
-                    a.layout.flex.row,
-                    a.layout.flex.alignCenter,
-                    a.radius.all.sm,
-                    py[1],
-                    pl[2],
-                    pr[2],
+exports.DropdownMenuItem = (0, react_1.forwardRef)(({ inset, disabled, style, children, ...props }, ref) => {
+    return ((0, jsx_runtime_1.jsx)(react_native_1.Pressable, { ...props, children: (0, jsx_runtime_1.jsx)(text_1.TextContext.Provider, { value: (0, text_1.objectFromObjects)([atoms_1.a.textColors.gray[900], atoms_1.a.fontSize.base]), children: (0, jsx_runtime_1.jsx)(react_native_1.View, { style: [
+                    atoms_1.a.layout.flex.row,
+                    atoms_1.a.layout.flex.alignCenter,
+                    atoms_1.a.radius.all.sm,
+                    atoms_1.py[1],
+                    atoms_1.pl[2],
+                    atoms_1.pr[2],
                 ], children: typeof children === "function"
                     ? children({ pressed: true })
                     : children }) }) }));
 });
-export const DropdownMenuCheckboxItem = forwardRef(({ children, checked, ...props }, ref) => {
-    return (_jsx(DropdownMenuPrimitive.CheckboxItem, { ref: ref, checked: checked, closeOnPress: props.closeOnPress || false, ...props, children: _jsxs(View, { style: [
-                a.layout.flex.row,
-                a.layout.flex.alignCenter,
-                a.radius.all.sm,
-                py[1],
-                pl[2],
-                pr[2],
-                pr[8],
-            ], children: [children, _jsx(View, { style: [pl[1], layout.position.absolute, right[1]], children: checked ? (_jsx(CheckCircle, { size: 14, strokeWidth: 3, color: "white" })) : (_jsx(Circle, { size: 14, strokeWidth: 3, color: a.colors.gray[400] })) })] }) }));
+exports.DropdownMenuCheckboxItem = (0, react_1.forwardRef)(({ children, checked, ...props }, ref) => {
+    return ((0, jsx_runtime_1.jsx)(DropdownMenuPrimitive.CheckboxItem, { ref: ref, checked: checked, closeOnPress: props.closeOnPress || false, ...props, children: (0, jsx_runtime_1.jsxs)(react_native_1.View, { style: [
+                atoms_1.a.layout.flex.row,
+                atoms_1.a.layout.flex.alignCenter,
+                atoms_1.a.radius.all.sm,
+                atoms_1.py[1],
+                atoms_1.pl[2],
+                atoms_1.pr[2],
+                atoms_1.pr[8],
+            ], children: [children, (0, jsx_runtime_1.jsx)(react_native_1.View, { style: [atoms_1.pl[1], atoms_1.layout.position.absolute, atoms_1.right[1]], children: checked ? ((0, jsx_runtime_1.jsx)(lucide_react_native_1.CheckCircle, { size: 14, strokeWidth: 3, color: "white" })) : ((0, jsx_runtime_1.jsx)(lucide_react_native_1.Circle, { size: 14, strokeWidth: 3, color: atoms_1.a.colors.gray[400] })) })] }) }));
 });
-export const DropdownMenuRadioItem = forwardRef(({ children, ...props }, ref) => {
-    return (_jsx(DropdownMenuPrimitive.RadioItem, { ref: ref, closeOnPress: props.closeOnPress || false, ...props, children: _jsxs(View, { style: [
-                a.layout.flex.row,
-                a.layout.flex.alignCenter,
-                a.radius.all.sm,
-                py[1],
-                pl[2],
-                pr[1],
-            ], children: [_jsx(View, { style: [pl[1], layout.position.absolute, right[1]], children: _jsx(DropdownMenuPrimitive.ItemIndicator, { children: _jsx(Check, { size: 14, strokeWidth: 3, color: "white" }) }) }), children] }) }));
+exports.DropdownMenuRadioItem = (0, react_1.forwardRef)(({ children, ...props }, ref) => {
+    return ((0, jsx_runtime_1.jsx)(DropdownMenuPrimitive.RadioItem, { ref: ref, closeOnPress: props.closeOnPress || false, ...props, children: (0, jsx_runtime_1.jsxs)(react_native_1.View, { style: [
+                atoms_1.a.layout.flex.row,
+                atoms_1.a.layout.flex.alignCenter,
+                atoms_1.a.radius.all.sm,
+                atoms_1.py[1],
+                atoms_1.pl[2],
+                atoms_1.pr[1],
+            ], children: [(0, jsx_runtime_1.jsx)(react_native_1.View, { style: [atoms_1.pl[1], atoms_1.layout.position.absolute, atoms_1.right[1]], children: (0, jsx_runtime_1.jsx)(DropdownMenuPrimitive.ItemIndicator, { children: (0, jsx_runtime_1.jsx)(lucide_react_native_1.Check, { size: 14, strokeWidth: 3, color: "white" }) }) }), children] }) }));
 });
-export const DropdownMenuLabel = forwardRef(({ inset, ...props }, ref) => {
-    return (_jsx(Text, { ref: ref, style: [
-            px[2],
-            py[2],
-            a.textColors.gray[200],
-            a.fontSize.base,
-            inset && gap[2],
+exports.DropdownMenuLabel = (0, react_1.forwardRef)(({ inset, ...props }, ref) => {
+    return ((0, jsx_runtime_1.jsx)(react_native_1.Text, { ref: ref, style: [
+            atoms_1.px[2],
+            atoms_1.py[2],
+            atoms_1.a.textColors.gray[200],
+            atoms_1.a.fontSize.base,
+            inset && atoms_1.gap[2],
         ], ...props }));
 });
-export const DropdownMenuSeparator = forwardRef((props, ref) => {
-    return (_jsx(View, { ref: ref, style: [mx[2], h[0.5] || { height: 0.5 }, bg.gray[800]], ...props }));
+exports.DropdownMenuSeparator = (0, react_1.forwardRef)((props, ref) => {
+    return ((0, jsx_runtime_1.jsx)(react_native_1.View, { ref: ref, style: [atoms_1.mx[2], atoms_1.h[0.5] || { height: 0.5 }, atoms_1.bg.gray[800]], ...props }));
 });
-export function DropdownMenuShortcut(props) {
-    return (_jsx(Text, { style: [
-            ml.auto,
-            a.textColors.gray[500],
-            a.fontSize.sm,
-            a.letterSpacing.widest,
+function DropdownMenuShortcut(props) {
+    return ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: [
+            atoms_1.ml.auto,
+            atoms_1.a.textColors.gray[500],
+            atoms_1.a.fontSize.sm,
+            atoms_1.a.letterSpacing.widest,
         ], ...props }));
 }
-export const DropdownMenuGroup = forwardRef((props, ref) => {
+exports.DropdownMenuGroup = (0, react_1.forwardRef)((props, ref) => {
     const { inset, title, children, ...rest } = props;
-    return (_jsxs(View, { style: [pt[2], inset ? gap[2] : gap[1]], ref: ref, ...rest, children: [title && (_jsx(Text, { style: [textColors.gray[400], pb[1], pl[2]], children: title })), _jsx(View, { style: [
-                    bg.gray[900],
-                    Platform.OS === "web" ? px[2] : p[2],
-                    gap[2],
-                    { borderRadius: borderRadius.lg, gap: 10 },
+    return ((0, jsx_runtime_1.jsxs)(react_native_1.View, { style: [atoms_1.pt[2], inset ? atoms_1.gap[2] : atoms_1.gap[1]], ref: ref, ...rest, children: [title && ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: [atoms_1.textColors.gray[400], atoms_1.pb[1], atoms_1.pl[2]], children: title })), (0, jsx_runtime_1.jsx)(react_native_1.View, { style: [
+                    atoms_1.bg.gray[900],
+                    react_native_1.Platform.OS === "web" ? atoms_1.px[2] : atoms_1.p[2],
+                    atoms_1.gap[2],
+                    { borderRadius: atoms_1.borderRadius.lg, gap: 10 },
                 ], children: children })] }));
 });
-export const DropdownMenuInfo = forwardRef(({ description, ...props }, ref) => {
-    return (_jsx(Text, { style: [textColors.gray[400], pt[1], pl[2], pb[2], fontSize.sm], children: description }));
+exports.DropdownMenuInfo = (0, react_1.forwardRef)(({ description, ...props }, ref) => {
+    return ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: [atoms_1.textColors.gray[400], atoms_1.pt[1], atoms_1.pl[2], atoms_1.pb[2], atoms_1.fontSize.sm], children: description }));
 });

package/dist/components/ui/icons.js

@@ -1,5 +1,8 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useTheme } from "../../lib/theme";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createThemedIcon = createThemedIcon;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const theme_1 = require("../../lib/theme");
 // Size mapping
 const sizeMap = {
     sm: 16,
@@ -8,15 +11,15 @@ const sizeMap = {
     xl: 32,
 };
 // HOC to create themed icons
-export function createThemedIcon(IconComponent) {
+function createThemedIcon(IconComponent) {
     return ({ variant = "default", size = "md", color, ...restProps }) => {
-        let theme = useTheme(); // Ensure theme is available
+        let theme = (0, theme_1.useTheme)(); // Ensure theme is available
         // Calculate size
         const iconSize = typeof size === "number" ? size : sizeMap[size];
         // Calculate color if not provided using atoms
         const iconColor = color ||
             theme.theme.colors[variant] ||
             theme.theme.colors.secondaryForeground;
-        return (_jsx(IconComponent, { size: iconSize, color: iconColor, ...restProps }));
+        return ((0, jsx_runtime_1.jsx)(IconComponent, { size: iconSize, color: iconColor, ...restProps }));
     };
 }

package/dist/components/ui/index.js

@@ -1,22 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TextPrimitive = exports.ModalPrimitive = exports.InputPrimitive = exports.ButtonPrimitive = void 0;
+const tslib_1 = require("tslib");
 // Export primitive components
-export * from "./primitives/button";
-export * from "./primitives/input";
-export * from "./primitives/modal";
-export * from "./primitives/text";
+tslib_1.__exportStar(require("./primitives/button"), exports);
+tslib_1.__exportStar(require("./primitives/input"), exports);
+tslib_1.__exportStar(require("./primitives/modal"), exports);
+tslib_1.__exportStar(require("./primitives/text"), exports);
 // Export styled components
-export * from "./button";
-export * from "./dialog";
-export * from "./dropdown";
-export * from "./icons";
-export * from "./input";
-export * from "./loader";
-export * from "./resizeable";
-export * from "./text";
-export * from "./toast";
-export * from "./view";
+tslib_1.__exportStar(require("./button"), exports);
+tslib_1.__exportStar(require("./dialog"), exports);
+tslib_1.__exportStar(require("./dropdown"), exports);
+tslib_1.__exportStar(require("./icons"), exports);
+tslib_1.__exportStar(require("./input"), exports);
+tslib_1.__exportStar(require("./loader"), exports);
+tslib_1.__exportStar(require("./resizeable"), exports);
+tslib_1.__exportStar(require("./text"), exports);
+tslib_1.__exportStar(require("./toast"), exports);
+tslib_1.__exportStar(require("./view"), exports);
 // Component collections for easy importing
-export { ButtonPrimitive } from "./primitives/button";
-export { InputPrimitive } from "./primitives/input";
-export { ModalPrimitive } from "./primitives/modal";
-export { TextPrimitive } from "./primitives/text";
-export * from "../../lib/theme";
+var button_1 = require("./primitives/button");
+Object.defineProperty(exports, "ButtonPrimitive", { enumerable: true, get: function () { return button_1.ButtonPrimitive; } });
+var input_1 = require("./primitives/input");
+Object.defineProperty(exports, "InputPrimitive", { enumerable: true, get: function () { return input_1.InputPrimitive; } });
+var modal_1 = require("./primitives/modal");
+Object.defineProperty(exports, "ModalPrimitive", { enumerable: true, get: function () { return modal_1.ModalPrimitive; } });
+var text_1 = require("./primitives/text");
+Object.defineProperty(exports, "TextPrimitive", { enumerable: true, get: function () { return text_1.TextPrimitive; } });
+tslib_1.__exportStar(require("../../lib/theme"), exports);

package/dist/components/ui/input.js

@@ -1,10 +1,14 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { cva } from "class-variance-authority";
-import React, { forwardRef } from "react";
-import { Platform, StyleSheet, TouchableWithoutFeedback } from "react-native";
-import { useTheme } from "../../lib/theme/theme";
-import { InputPrimitive } from "./primitives/input";
-const inputVariants = cva("", {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.inputVariants = exports.Input = void 0;
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const class_variance_authority_1 = require("class-variance-authority");
+const react_1 = tslib_1.__importStar(require("react"));
+const react_native_1 = require("react-native");
+const theme_1 = require("../../lib/theme/theme");
+const input_1 = require("./primitives/input");
+const inputVariants = (0, class_variance_authority_1.cva)("", {
     variants: {
         variant: {
             default: "default",
@@ -22,44 +26,45 @@ const inputVariants = cva("", {
         size: "md",
     },
 });
-export const Input = forwardRef(({ variant = "default", size = "md", label, description, error, required = false, leftAddon, rightAddon, disabled = false, containerStyle, inputStyle, ...props }, ref) => {
-    const { theme } = useTheme();
-    const [isFocused, setIsFocused] = React.useState(false);
-    const inputRef = React.useRef(null);
+exports.inputVariants = inputVariants;
+exports.Input = (0, react_1.forwardRef)(({ variant = "default", size = "md", label, description, error, required = false, leftAddon, rightAddon, disabled = false, containerStyle, inputStyle, ...props }, ref) => {
+    const { theme } = (0, theme_1.useTheme)();
+    const [isFocused, setIsFocused] = react_1.default.useState(false);
+    const inputRef = react_1.default.useRef(null);
     // Create dynamic styles based on theme
-    const styles = React.useMemo(() => createStyles(theme), [theme]);
+    const styles = react_1.default.useMemo(() => createStyles(theme), [theme]);
     // Get variant and size styles
-    const containerStyles = React.useMemo(() => {
+    const containerStyles = react_1.default.useMemo(() => {
         const variantStyle = styles[`${variant}Container`];
         const sizeStyle = styles[`${size}Container`];
         const focusStyle = isFocused ? styles.focusedContainer : null;
         return [variantStyle, sizeStyle, focusStyle];
     }, [variant, size, styles, isFocused]);
-    const textStyles = React.useMemo(() => {
+    const textStyles = react_1.default.useMemo(() => {
         const variantTextStyle = styles[`${variant}Input`];
         const sizeTextStyle = styles[`${size}Input`];
         return [variantTextStyle, sizeTextStyle];
     }, [variant, size, styles]);
-    const handleFocus = React.useCallback((event) => {
+    const handleFocus = react_1.default.useCallback((event) => {
         setIsFocused(true);
         if (props.onFocus) {
             props.onFocus(event);
         }
     }, [props.onFocus]);
-    const handleBlur = React.useCallback((event) => {
+    const handleBlur = react_1.default.useCallback((event) => {
         setIsFocused(false);
         if (props.onBlur) {
             props.onBlur(event);
         }
     }, [props.onBlur]);
-    const handleContainerPress = React.useCallback(() => {
+    const handleContainerPress = react_1.default.useCallback(() => {
         if (inputRef.current && !disabled) {
             inputRef.current.focus();
         }
     }, [disabled]);
     const hasAddons = leftAddon || rightAddon;
     if (hasAddons) {
-        return (_jsxs(InputPrimitive.Group, { children: [label && (_jsx(InputPrimitive.Label, { required: required, disabled: disabled, error: !!error, children: label })), _jsx(TouchableWithoutFeedback, { onPress: handleContainerPress, children: _jsxs(InputPrimitive.Container, { focused: isFocused, error: !!error, disabled: disabled, style: [containerStyles, containerStyle, { padding: 0 }], children: [leftAddon && (_jsx(InputPrimitive.Addon, { position: "left", children: leftAddon })), _jsx(InputPrimitive.Root, { ref: (node) => {
+        return ((0, jsx_runtime_1.jsxs)(input_1.InputPrimitive.Group, { children: [label && ((0, jsx_runtime_1.jsx)(input_1.InputPrimitive.Label, { required: required, disabled: disabled, error: !!error, children: label })), (0, jsx_runtime_1.jsx)(react_native_1.TouchableWithoutFeedback, { onPress: handleContainerPress, children: (0, jsx_runtime_1.jsxs)(input_1.InputPrimitive.Container, { focused: isFocused, error: !!error, disabled: disabled, style: [containerStyles, containerStyle, { padding: 0 }], children: [leftAddon && ((0, jsx_runtime_1.jsx)(input_1.InputPrimitive.Addon, { position: "left", children: leftAddon })), (0, jsx_runtime_1.jsx)(input_1.InputPrimitive.Root, { ref: (node) => {
                                     inputRef.current = node;
                                     if (ref) {
                                         if (typeof ref === "function") {
@@ -74,9 +79,9 @@ export const Input = forwardRef(({ variant = "default", size = "md", label, desc
                                     styles.inputInContainer,
                                     inputStyle,
                                     { outline: "none" },
-                                ], placeholderTextColor: disabled ? theme.colors.textDisabled : theme.colors.textMuted, ...props }), rightAddon && (_jsx(InputPrimitive.Addon, { position: "right", children: rightAddon }))] }) }), description && !error && (_jsx(InputPrimitive.Description, { disabled: disabled, children: description })), _jsx(InputPrimitive.Error, { visible: !!error, children: error })] }));
+                                ], placeholderTextColor: disabled ? theme.colors.textDisabled : theme.colors.textMuted, ...props }), rightAddon && ((0, jsx_runtime_1.jsx)(input_1.InputPrimitive.Addon, { position: "right", children: rightAddon }))] }) }), description && !error && ((0, jsx_runtime_1.jsx)(input_1.InputPrimitive.Description, { disabled: disabled, children: description })), (0, jsx_runtime_1.jsx)(input_1.InputPrimitive.Error, { visible: !!error, children: error })] }));
     }
-    return (_jsxs(InputPrimitive.Group, { children: [label && (_jsx(InputPrimitive.Label, { required: required, disabled: disabled, error: !!error, children: label })), _jsx(InputPrimitive.Root, { ref: (node) => {
+    return ((0, jsx_runtime_1.jsxs)(input_1.InputPrimitive.Group, { children: [label && ((0, jsx_runtime_1.jsx)(input_1.InputPrimitive.Label, { required: required, disabled: disabled, error: !!error, children: label })), (0, jsx_runtime_1.jsx)(input_1.InputPrimitive.Root, { ref: (node) => {
                     inputRef.current = node;
                     if (ref) {
                         if (typeof ref === "function") {
@@ -86,12 +91,12 @@ export const Input = forwardRef(({ variant = "default", size = "md", label, desc
                             ref.current = node;
                         }
                     }
-                }, disabled: disabled, error: !!error, onFocus: handleFocus, onBlur: handleBlur, style: [containerStyles, textStyles, containerStyle, inputStyle], placeholderTextColor: disabled ? theme.colors.textDisabled : theme.colors.textMuted, ...props }), description && !error && (_jsx(InputPrimitive.Description, { disabled: disabled, children: description })), _jsx(InputPrimitive.Error, { visible: !!error, children: error })] }));
+                }, disabled: disabled, error: !!error, onFocus: handleFocus, onBlur: handleBlur, style: [containerStyles, textStyles, containerStyle, inputStyle], placeholderTextColor: disabled ? theme.colors.textDisabled : theme.colors.textMuted, ...props }), description && !error && ((0, jsx_runtime_1.jsx)(input_1.InputPrimitive.Description, { disabled: disabled, children: description })), (0, jsx_runtime_1.jsx)(input_1.InputPrimitive.Error, { visible: !!error, children: error })] }));
 });
-Input.displayName = "Input";
+exports.Input.displayName = "Input";
 // Create theme-aware styles
 function createStyles(theme) {
-    return StyleSheet.create({
+    return react_native_1.StyleSheet.create({
         // Variant styles for containers
         defaultContainer: {
             backgroundColor: theme.colors.background,
@@ -145,7 +150,7 @@ function createStyles(theme) {
         smInput: {
             fontSize: 14,
             lineHeight: 18,
-            ...Platform.select({
+            ...react_native_1.Platform.select({
                 ios: {
                     paddingVertical: 0,
                 },
@@ -158,7 +163,7 @@ function createStyles(theme) {
         mdInput: {
             fontSize: 16,
             lineHeight: 20,
-            ...Platform.select({
+            ...react_native_1.Platform.select({
                 ios: {
                     paddingVertical: 0,
                 },
@@ -171,7 +176,7 @@ function createStyles(theme) {
         lgInput: {
             fontSize: 18,
             lineHeight: 22,
-            ...Platform.select({
+            ...react_native_1.Platform.select({
                 ios: {
                     paddingVertical: 0,
                 },
@@ -198,5 +203,3 @@ function createStyles(theme) {
         },
     });
 }
-// Export input variants for external use
-export { inputVariants };

package/dist/components/ui/loader.js

@@ -1,7 +1,10 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { ActivityIndicator as RNActivityIndicator } from "react-native";
-import { useTheme } from "../../lib/theme";
-export function Loader(props) {
-    const { theme } = useTheme();
-    return _jsx(RNActivityIndicator, { color: theme.colors.primary, ...props });
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Loader = Loader;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_native_1 = require("react-native");
+const theme_1 = require("../../lib/theme");
+function Loader(props) {
+    const { theme } = (0, theme_1.useTheme)();
+    return (0, jsx_runtime_1.jsx)(react_native_1.ActivityIndicator, { color: theme.colors.primary, ...props });
 }