@react-xp/aeiou 0.1.0-beta.1 → 0.1.0-beta.11

package/dist/esm/components/i/i.web.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useCn, useOnChange } from '../../hooks/index.web';
 import { useIUtils } from './useIUtils';
-export function I({ className, value, defaultValue, placeholder, onChange, onChangeValue, type, inputMode, keyboardType, disabled, editable, ref, ...rest }) {
+export function I({ className, value, defaultValue, placeholder, onChange, onChangeValue, type, inputMode, keyboardType, disabled, editable, ref, style, ...rest }) {
     const { treatTypeModeAndKeyboardType } = useIUtils();
     const cn = useCn();
     const { onChange: handleOnChange } = useOnChange({
@@ -14,6 +14,6 @@ export function I({ className, value, defaultValue, placeholder, onChange, onCha
         keyboardType,
         type,
     });
-    return (_jsx("input", { ref: ref, type: masterInputType, inputMode: masterInputMode, className: cn('outline-none', effectiveDisabled && 'opacity-60 cursor-not-allowed', className), value: value, defaultValue: defaultValue, placeholder: placeholder, onChange: handleOnChange, disabled: effectiveDisabled, ...rest }));
+    return (_jsx("input", { ref: ref, type: masterInputType, inputMode: masterInputMode, className: cn('outline-none', effectiveDisabled && 'opacity-60 cursor-not-allowed', className), value: value?.toString(), defaultValue: defaultValue?.toString(), placeholder: placeholder, onChange: handleOnChange, disabled: effectiveDisabled, style: style, ...rest }));
 }
 export const Input = I;

package/dist/esm/components/l/l.web.js

@@ -1,13 +1,13 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useAction } from '../../hooks/index.native';
 import { useCn } from '../../hooks/index.web';
-export function L({ className, children, to, href, onClick, onPress, preventDefault, ref, ...rest }) {
+export function L({ className, children, to, href, onClick, onPress, preventDefault, ref, style, ...rest }) {
     const cn = useCn();
     const { onAction } = useAction({
         onClick,
         onPress,
     });
     const resolvedHref = href ?? to ?? '#';
-    return (_jsx("a", { ref: ref, href: resolvedHref, className: cn('cursor-pointer', className), onClick: onAction, ...rest, children: children }));
+    return (_jsx("a", { ref: ref, href: resolvedHref, className: cn('cursor-pointer', className), onClick: onAction, style: style, ...rest, children: children }));
 }
 export const Link = L;

package/dist/esm/components/o/o.web.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useCn } from '../../hooks/index.web';
-export function O({ className, children, horizontal, ref, ...rest }) {
+export function O({ className, children, horizontal, ref, style, ...rest }) {
     const cn = useCn();
     const overflowClass = horizontal ? 'overflow-x-auto' : 'overflow-y-auto';
-    return (_jsx("div", { ref: ref, className: cn(overflowClass, className), ...rest, children: children }));
+    return (_jsx("div", { ref: ref, className: cn(overflowClass, className), style: style, ...rest, children: children }));
 }
 export const Overflow = O;

package/dist/esm/components/p/p.web.js

@@ -1,9 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useCn } from '../../hooks/index.web';
-export function P({ alt, className, ref, ...rest }) {
+export function P({ alt, className, ref, style, ...rest }) {
     const cn = useCn();
     return (
     // biome-ignore lint/a11y/useAltText: <explanation>
-    _jsx("img", { alt: alt, "aria-label": alt, ref: ref, className: cn('object-cover', className), ...rest }));
+    _jsx("img", { alt: alt, "aria-label": alt, ref: ref, className: cn('object-cover', className), style: style, ...rest }));
 }
 export const Picture = P;

package/dist/esm/hooks/index.js

@@ -2,4 +2,5 @@ export * from './useAction/useAction.web';
 export * from './useCn';
 export * from './useInteractiveState/useInteractiveState.web';
 export * from './useOnChange';
+export * from './useOnHoverOrPress';
 export * from './useProps';

package/dist/esm/hooks/index.native.js

@@ -2,4 +2,5 @@ export * from './useAction/useAction.native';
 export * from './useCn';
 export * from './useInteractiveState/useInteractiveState.native';
 export * from './useOnChange';
+export * from './useOnHoverOrPress';
 export * from './useProps';

package/dist/esm/hooks/index.web.js

@@ -2,4 +2,5 @@ export * from './useAction/useAction.web';
 export * from './useCn';
 export * from './useInteractiveState/useInteractiveState.web';
 export * from './useOnChange';
+export * from './useOnHoverOrPress';
 export * from './useProps';

package/dist/esm/hooks/useInteractiveState/useInteractiveState.native.js

@@ -1,68 +1,28 @@
-import { useEffect, useMemo, useState } from 'react';
-function computeVisualState(state) {
-    if (state.disabled)
-        return 'disabled';
-    if (state.pressed)
-        return 'pressed';
-    if (state.hovered)
-        return 'hovered';
-    if (state.focused)
-        return 'focused';
-    return 'default';
-}
-function toDataAttrs(state) {
-    const visual = computeVisualState(state);
-    return {
-        'data-state': visual,
-        'data-hovered': String(state.hovered),
-        'data-pressed': String(state.pressed),
-        'data-focused': String(state.focused),
-        'data-disabled': String(state.disabled),
-    };
-}
+import { useState } from 'react';
 export function useInteractiveState(options = {}) {
-    const { disabled = false } = options;
-    const [state, setState] = useState({
-        hovered: false,
-        pressed: false,
-        focused: false,
-        disabled,
-    });
-    useEffect(() => {
-        setState((prev) => ({ ...prev, disabled }));
-    }, [disabled]);
-    const eventHandlers = useMemo(() => ({
-        onMouseEnter: () => {
-            if (disabled)
-                return;
-            setState((prev) => ({ ...prev, hovered: true }));
-        },
-        onMouseLeave: () => {
-            if (disabled)
-                return;
-            setState((prev) => ({ ...prev, hovered: false, pressed: false }));
-        },
-        onMouseDown: () => {
-            if (disabled)
-                return;
-            setState((prev) => ({ ...prev, pressed: true }));
-        },
-        onMouseUp: () => {
-            if (disabled)
-                return;
-            setState((prev) => ({ ...prev, pressed: false }));
-        },
-        onFocus: () => {
+    const { disabled } = options;
+    const [pressed, setPressed] = useState(false);
+    const state = disabled
+        ? 'disabled'
+        : pressed
+            ? 'pressed'
+            : 'idle';
+    const dataAttrs = {
+        'data-state': state,
+        'data-pressed': pressed ? 'true' : 'false',
+        'data-disabled': disabled ? 'true' : 'false',
+    };
+    const eventHandlers = {
+        onPressIn: (e) => {
             if (disabled)
                 return;
-            setState((prev) => ({ ...prev, focused: true }));
+            setPressed(true);
         },
-        onBlur: () => {
+        onPressOut: (e) => {
             if (disabled)
                 return;
-            setState((prev) => ({ ...prev, focused: false, pressed: false }));
+            setPressed(false);
         },
-    }), [disabled]);
-    const dataAttrs = toDataAttrs(state);
+    };
     return { state, dataAttrs, eventHandlers };
 }

package/dist/esm/hooks/useInteractiveState/useInteractiveState.web.js

@@ -1,68 +1,59 @@
-import { useEffect, useMemo, useState } from 'react';
-function computeVisualState(state) {
-    if (state.disabled)
-        return 'disabled';
-    if (state.pressed)
-        return 'pressed';
-    if (state.hovered)
-        return 'hovered';
-    if (state.focused)
-        return 'focused';
-    return 'default';
-}
-function toDataAttrs(state) {
-    const visual = computeVisualState(state);
-    return {
-        'data-state': visual,
-        'data-hovered': String(state.hovered),
-        'data-pressed': String(state.pressed),
-        'data-focused': String(state.focused),
-        'data-disabled': String(state.disabled),
-    };
-}
+import { useState } from 'react';
 export function useInteractiveState(options = {}) {
-    const { disabled = false } = options;
-    const [state, setState] = useState({
-        hovered: false,
-        pressed: false,
-        focused: false,
-        disabled,
-    });
-    useEffect(() => {
-        setState((prev) => ({ ...prev, disabled }));
-    }, [disabled]);
-    const eventHandlers = useMemo(() => ({
+    const { disabled } = options;
+    const [hovered, setHovered] = useState(false);
+    const [pressed, setPressed] = useState(false);
+    const [focused, setFocused] = useState(false);
+    const state = disabled
+        ? 'disabled'
+        : pressed
+            ? 'pressed'
+            : hovered
+                ? 'hovered'
+                : focused
+                    ? 'focused'
+                    : 'idle';
+    const dataAttrs = {
+        'data-state': state,
+        'data-hovered': hovered ? 'true' : 'false',
+        'data-pressed': pressed ? 'true' : 'false',
+        'data-focused': focused ? 'true' : 'false',
+        'data-disabled': disabled ? 'true' : 'false',
+    };
+    const eventHandlers = {
         onMouseEnter: () => {
             if (disabled)
                 return;
-            setState((prev) => ({ ...prev, hovered: true }));
+            setHovered(true);
         },
         onMouseLeave: () => {
             if (disabled)
                 return;
-            setState((prev) => ({ ...prev, hovered: false, pressed: false }));
+            setHovered(false);
+            setPressed(false);
         },
-        onMouseDown: () => {
-            if (disabled)
+        onMouseDown: (e) => {
+            if (disabled || e.button !== 0)
                 return;
-            setState((prev) => ({ ...prev, pressed: true }));
+            setPressed(true);
         },
         onMouseUp: () => {
             if (disabled)
                 return;
-            setState((prev) => ({ ...prev, pressed: false }));
+            setPressed(false);
         },
         onFocus: () => {
             if (disabled)
                 return;
-            setState((prev) => ({ ...prev, focused: true }));
+            setFocused(true);
         },
         onBlur: () => {
             if (disabled)
                 return;
-            setState((prev) => ({ ...prev, focused: false, pressed: false }));
+            setFocused(false);
+            setPressed(false);
+            setHovered(false);
         },
-    }), [disabled]);
-    const dataAttrs = toDataAttrs(state);
+    };
     return { state, dataAttrs, eventHandlers };
 }

package/dist/esm/hooks/useOnChange.js

@@ -1,5 +1,5 @@
 import { useMemo } from 'react';
-export const useOnChange = ({ onChange, onChangeValue }) => {
+export const useOnChange = ({ onChange, onChangeValue, }) => {
     return useMemo(() => ({
         onChange: (event) => {
             if (onChange) {

package/dist/esm/hooks/useOnHoverOrPress.js

@@ -0,0 +1,17 @@
+import { useMemo, useRef } from 'react';
+export const useOnHoverOrPress = ({ onIn, onOut }) => {
+    const value = useRef('on');
+    return useMemo(() => ({
+        onMouseEnter: onIn,
+        onMouseLeave: onOut,
+        onPress: (event) => {
+            if (value.current === 'on') {
+                value.current = 'off';
+                onOut?.(event);
+                return;
+            }
+            value.current = 'on';
+            onIn?.(event);
+        },
+    }), [onIn, onOut]);
+};

package/dist/native/cjs/components/a/a.native.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Action = void 0;
+exports.A = A;
+const jsx_runtime_1 = require("nativewind/jsx-runtime");
+const react_native_1 = require("react-native");
+const index_native_1 = require("../../hooks/index.native");
+const index_native_2 = require("../e/index.native");
+function A({ className, children, onPress, onClick, disabled, ref, style, ...rest }) {
+    const cn = (0, index_native_1.useCn)();
+    const { onAction } = (0, index_native_1.useAction)({
+        onClick,
+        onPress,
+    });
+    return ((0, jsx_runtime_1.jsx)(react_native_1.Pressable, { ref: ref, onPress: onAction, disabled: disabled, children: (0, jsx_runtime_1.jsx)(index_native_2.E, { className: cn(disabled && 'opacity-60', className), style: style, ...rest, children: children }) }));
+}
+exports.Action = A;

package/dist/native/cjs/components/a/a.web.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Action = void 0;
+exports.A = A;
+const jsx_runtime_1 = require("nativewind/jsx-runtime");
+const index_web_1 = require("../../hooks/index.web");
+function A({ className, children, onPress, onClick, disabled, ref, style, ...rest }) {
+    const cn = (0, index_web_1.useCn)();
+    const { onAction } = (0, index_web_1.useAction)({
+        onClick,
+        onPress,
+    });
+    return ((0, jsx_runtime_1.jsx)("button", { ref: ref, type: "button", disabled: disabled, className: cn('cursor-pointer', disabled && 'opacity-60', className), onClick: onAction, style: style, ...rest, children: children }));
+}
+exports.Action = A;

package/dist/native/cjs/components/a/index.native.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./a.native"), exports);

package/dist/native/cjs/components/a/index.web.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./a.web"), exports);

package/dist/native/cjs/components/d/d.native.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Dialog = void 0;
+exports.D = D;
+const jsx_runtime_1 = require("nativewind/jsx-runtime");
+const react_native_1 = require("react-native");
+const index_native_1 = require("../../hooks/index.native");
+const index_native_2 = require("../e/index.native");
+function D({ open, onOpenChange, placement = 'center', backdropClassName, backdropStyle, containerClassName, containerStyle, contentClassName, contentStyle, children, ref, ...rest }) {
+    const cn = (0, index_native_1.useCn)();
+    const placementClasses = {
+        center: 'items-center justify-center',
+        top: 'items-start justify-center',
+        bottom: 'items-end justify-center',
+        left: 'items-stretch justify-start',
+        right: 'items-stretch justify-end',
+    };
+    const containerClasses = cn('flex-1 bg-black/40 flex', placementClasses[placement], containerClassName, backdropClassName);
+    const contentClasses = cn('bg-background p-4 rounded-lg shadow-lg max-h-[90vh] w-full max-w-lg', placement === 'left' || placement === 'right' ? 'h-full max-h-none' : '', placement === 'bottom' || placement === 'top' ? 'max-w-none' : '', contentClassName);
+    const handleRequestClose = (e) => {
+        onOpenChange?.(false);
+        if (typeof rest.onRequestClose === 'function') {
+            rest.onRequestClose?.(e);
+        }
+    };
+    return ((0, jsx_runtime_1.jsx)(react_native_1.Modal, { visible: open, animationType: "slide", transparent: true, onRequestClose: handleRequestClose, ...rest, children: (0, jsx_runtime_1.jsx)(index_native_2.E, { className: containerClasses, style: { ...containerStyle, ...backdropStyle }, children: (0, jsx_runtime_1.jsx)(index_native_2.E, { ref: ref, className: contentClasses, style: contentStyle, children: children }) }) }));
+}
+exports.Dialog = D;

package/dist/native/cjs/components/d/d.web.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Dialog = void 0;
+exports.D = D;
+const jsx_runtime_1 = require("nativewind/jsx-runtime");
+const react_dom_1 = require("react-dom");
+const index_web_1 = require("../../hooks/index.web");
+const index_web_2 = require("../e/index.web");
+function D({ open, onOpenChange, placement = 'center', backdropClassName, backdropStyle, containerClassName, containerStyle, contentClassName, contentStyle, closeOnBackdropClick = true, children, ref, ...rest }) {
+    const cn = (0, index_web_1.useCn)();
+    if (typeof document === 'undefined')
+        return null;
+    if (!open)
+        return null;
+    const placementClasses = {
+        center: 'items-center justify-center',
+        top: 'items-start justify-center',
+        bottom: 'items-end justify-center',
+        left: 'items-stretch justify-start',
+        right: 'items-stretch justify-end',
+    };
+    const handleBackdropClick = (event) => {
+        if (event.target !== event.currentTarget)
+            return;
+        if (closeOnBackdropClick) {
+            onOpenChange?.(false);
+        }
+    };
+    const backdropClasses = cn('fixed inset-0 z-50 flex bg-black/40', placementClasses[placement], containerClassName, backdropClassName);
+    const contentClasses = cn('relative max-h-[90vh] w-full max-w-lg overflow-auto rounded-lg bg-background p-4 shadow-lg', placement === 'left' || placement === 'right' ? 'h-full max-h-none' : '', placement === 'bottom' || placement === 'top' ? 'max-w-none' : '', contentClassName);
+    return (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsx)(index_web_2.E, { className: backdropClasses, role: "presentation", onClick: handleBackdropClick, style: {
+            ...containerStyle,
+            ...backdropStyle,
+        }, children: (0, jsx_runtime_1.jsx)("div", { ref: ref, 
+            // biome-ignore lint/a11y/useSemanticElements: <explanation>
+            role: "dialog", "aria-modal": "true", className: contentClasses, style: contentStyle, ...rest, children: children }) }), document.body);
+}
+exports.Dialog = D;

package/dist/native/cjs/components/d/index.native.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./d.native"), exports);

package/dist/native/cjs/components/d/index.web.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./d.web"), exports);

package/dist/native/cjs/components/e/e.native.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Element = void 0;
+exports.E = E;
+const jsx_runtime_1 = require("nativewind/jsx-runtime");
+const react_native_1 = require("react-native");
+const index_native_1 = require("../../hooks/index.native");
+const index_native_2 = require("../t/index.native");
+function E({ className, children, onIn, onOut, onClick, onPress, ref, style, ...rest }) {
+    const cn = (0, index_native_1.useCn)();
+    const { onAction } = (0, index_native_1.useAction)({
+        onClick,
+        onPress,
+    });
+    const { onPress: onHoverOrPress } = (0, index_native_1.useOnHoverOrPress)({ onIn, onOut });
+    const handleOnPress = () => {
+        onAction();
+        onHoverOrPress();
+        return false;
+    };
+    return ((0, jsx_runtime_1.jsx)(react_native_1.View, { ref: ref, className: cn(className), onStartShouldSetResponder: handleOnPress, style: style, ...rest, children: typeof children === 'string' ? (0, jsx_runtime_1.jsx)(index_native_2.T, { children: children }) : children }));
+}
+exports.Element = E;

package/dist/native/cjs/components/e/e.web.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Element = void 0;
+exports.E = E;
+const jsx_runtime_1 = require("nativewind/jsx-runtime");
+const index_web_1 = require("../../hooks/index.web");
+function E({ className, children, onIn, onOut, onPress, onClick, ref, style, ...rest }) {
+    const cn = (0, index_web_1.useCn)();
+    const { onAction } = (0, index_web_1.useAction)({
+        onClick,
+        onPress,
+    });
+    const { onMouseEnter, onMouseLeave } = (0, index_web_1.useOnHoverOrPress)({ onIn, onOut });
+    return ((0, jsx_runtime_1.jsx)("div", { ref: ref, className: cn(className), onClick: onAction, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, style: style, ...rest, children: children }));
+}
+exports.Element = E;

package/dist/native/cjs/components/e/index.native.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./e.native"), exports);

package/dist/native/cjs/components/e/index.web.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./e.web"), exports);

package/dist/native/cjs/components/i/i.native.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Input = void 0;
+exports.I = I;
+const jsx_runtime_1 = require("nativewind/jsx-runtime");
+const react_native_1 = require("react-native");
+const index_native_1 = require("../../hooks/index.native");
+const useIUtils_1 = require("./useIUtils");
+function I({ className, value, defaultValue, placeholder, onChange, onChangeValue, type, inputMode, keyboardType, editable, disabled, ref, style, ...rest }) {
+    const { treatTypeModeAndKeyboardType } = (0, useIUtils_1.useIUtils)();
+    const cn = (0, index_native_1.useCn)();
+    const { onChange: handleOnChange } = (0, index_native_1.useOnChange)({
+        onChange,
+        onChangeValue,
+    });
+    const effectiveEditable = editable ?? !disabled;
+    const { masterInputType, masterInputKeyboardType } = treatTypeModeAndKeyboardType({
+        inputMode,
+        keyboardType,
+        type,
+    });
+    return ((0, jsx_runtime_1.jsx)(react_native_1.TextInput, { ref: ref, className: cn(!effectiveEditable && 'opacity-60', className), value: value?.toString(), defaultValue: defaultValue?.toString(), placeholder: placeholder, onChange: handleOnChange, secureTextEntry: masterInputType === 'password', keyboardType: masterInputKeyboardType, editable: effectiveEditable, style: style, ...rest }));
+}
+exports.Input = I;

package/dist/native/cjs/components/i/i.web.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Input = void 0;
+exports.I = I;
+const jsx_runtime_1 = require("nativewind/jsx-runtime");
+const index_web_1 = require("../../hooks/index.web");
+const useIUtils_1 = require("./useIUtils");
+function I({ className, value, defaultValue, placeholder, onChange, onChangeValue, type, inputMode, keyboardType, disabled, editable, ref, style, ...rest }) {
+    const { treatTypeModeAndKeyboardType } = (0, useIUtils_1.useIUtils)();
+    const cn = (0, index_web_1.useCn)();
+    const { onChange: handleOnChange } = (0, index_web_1.useOnChange)({
+        onChange,
+        onChangeValue,
+    });
+    const effectiveDisabled = disabled || editable === false;
+    const { masterInputType, masterInputMode } = treatTypeModeAndKeyboardType({
+        inputMode,
+        keyboardType,
+        type,
+    });
+    return ((0, jsx_runtime_1.jsx)("input", { ref: ref, type: masterInputType, inputMode: masterInputMode, className: cn('outline-none', effectiveDisabled && 'opacity-60 cursor-not-allowed', className), value: value?.toString(), defaultValue: defaultValue?.toString(), placeholder: placeholder, onChange: handleOnChange, disabled: effectiveDisabled, style: style, ...rest }));
+}
+exports.Input = I;

package/dist/native/cjs/components/i/index.native.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./i.native"), exports);

package/dist/native/cjs/components/i/index.web.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./i.web"), exports);