@react-xp/aeiou 0.1.0-beta.5 → 0.1.0-beta.7

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

@@ -6,12 +6,12 @@ const jsx_runtime_1 = require("react/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, ...rest }) {
+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, ...rest, children: (0, jsx_runtime_1.jsx)(index_native_2.E, { className: cn(disabled && 'opacity-60', className), children: children }) }));
+    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/cjs/components/a/a.web.js

@@ -4,12 +4,12 @@ exports.Action = void 0;
 exports.A = A;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const index_web_1 = require("../../hooks/index.web");
-function A({ className, children, onPress, onClick, disabled, ref, ...rest }) {
+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, ...rest, children: children }));
+    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/cjs/components/d/d.web.js

@@ -6,7 +6,7 @@ const jsx_runtime_1 = require("react/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', className, backdropClassName, containerClassName, contentClassName, closeOnBackdropClick = true, children, ref, ...rest }) {
+function D({ open, onOpenChange, placement = 'center', className, backdropClassName, containerClassName, contentClassName, closeOnBackdropClick = true, children, ref, style, ...rest }) {
     const cn = (0, index_web_1.useCn)();
     if (typeof document === 'undefined')
         return null;
@@ -30,6 +30,6 @@ function D({ open, onOpenChange, placement = 'center', className, backdropClassN
     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' : '', className, contentClassName);
     return (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsx)(index_web_2.E, { className: backdropClasses, role: "presentation", onClick: handleBackdropClick, children: (0, jsx_runtime_1.jsx)("div", { ref: ref, 
             // biome-ignore lint/a11y/useSemanticElements: <explanation>
-            role: "dialog", "aria-modal": "true", className: contentClasses, ...rest, children: children }) }), document.body);
+            role: "dialog", "aria-modal": "true", className: contentClasses, style: style, ...rest, children: children }) }), document.body);
 }
 exports.Dialog = D;

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

@@ -6,7 +6,7 @@ const jsx_runtime_1 = require("react/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, onPress, onClick, ref, ...rest }) {
+function E({ className, children, onPress, onClick, ref, style, ...rest }) {
     const cn = (0, index_native_1.useCn)();
     const { onAction } = (0, index_native_1.useAction)({
         onClick,
@@ -16,6 +16,6 @@ function E({ className, children, onPress, onClick, ref, ...rest }) {
         onAction();
         return false;
     };
-    return ((0, jsx_runtime_1.jsx)(react_native_1.View, { ref: ref, className: cn(className), onStartShouldSetResponder: handleOnPress, ...rest, children: typeof children === 'string' ? (0, jsx_runtime_1.jsx)(index_native_2.T, { children: children }) : children }));
+    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/cjs/components/e/e.web.js

@@ -4,12 +4,12 @@ exports.Element = void 0;
 exports.E = E;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const index_web_1 = require("../../hooks/index.web");
-function E({ className, children, onPress, onClick, ref, ...rest }) {
+function E({ className, children, onPress, onClick, 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)("div", { ref: ref, className: cn(className), onClick: onAction, ...rest, children: children }));
+    return ((0, jsx_runtime_1.jsx)("div", { ref: ref, className: cn(className), onClick: onAction, style: style, ...rest, children: children }));
 }
 exports.Element = E;

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

@@ -6,7 +6,7 @@ const jsx_runtime_1 = require("react/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, ...rest }) {
+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)({
@@ -25,6 +25,6 @@ function I({ className, value, defaultValue, placeholder, onChange, onChangeValu
         if (onChangeValue)
             onChangeValue(event.nativeEvent.text);
     };
-    return ((0, jsx_runtime_1.jsx)(react_native_1.TextInput, { ref: ref, className: cn(!effectiveEditable && 'opacity-60', className), value: value, defaultValue: defaultValue, placeholder: placeholder, onChange: handleChange, secureTextEntry: masterInputType === 'password', keyboardType: masterInputKeyboardType, editable: effectiveEditable, ...rest }));
+    return ((0, jsx_runtime_1.jsx)(react_native_1.TextInput, { ref: ref, className: cn(!effectiveEditable && 'opacity-60', className), value: value, defaultValue: defaultValue, placeholder: placeholder, onChange: handleChange, secureTextEntry: masterInputType === 'password', keyboardType: masterInputKeyboardType, editable: effectiveEditable, style: style, ...rest }));
 }
 exports.Input = I;

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

@@ -5,7 +5,7 @@ exports.I = I;
 const jsx_runtime_1 = require("react/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, ...rest }) {
+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)({
@@ -18,6 +18,6 @@ function I({ className, value, defaultValue, placeholder, onChange, onChangeValu
         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, defaultValue: defaultValue, placeholder: placeholder, onChange: handleOnChange, disabled: effectiveDisabled, ...rest }));
+    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, defaultValue: defaultValue, placeholder: placeholder, onChange: handleOnChange, disabled: effectiveDisabled, style: style, ...rest }));
 }
 exports.Input = I;

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

@@ -5,13 +5,13 @@ exports.L = L;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const index_native_1 = require("../../hooks/index.native");
 const index_web_1 = require("../../hooks/index.web");
-function L({ className, children, to, href, onClick, onPress, preventDefault, ref, ...rest }) {
+function L({ className, children, to, href, onClick, onPress, preventDefault, ref, style, ...rest }) {
     const cn = (0, index_web_1.useCn)();
     const { onAction } = (0, index_native_1.useAction)({
         onClick,
         onPress,
     });
     const resolvedHref = href ?? to ?? '#';
-    return ((0, jsx_runtime_1.jsx)("a", { ref: ref, href: resolvedHref, className: cn('cursor-pointer', className), onClick: onAction, ...rest, children: children }));
+    return ((0, jsx_runtime_1.jsx)("a", { ref: ref, href: resolvedHref, className: cn('cursor-pointer', className), onClick: onAction, style: style, ...rest, children: children }));
 }
 exports.Link = L;

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

@@ -4,9 +4,9 @@ exports.Overflow = void 0;
 exports.O = O;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const index_web_1 = require("../../hooks/index.web");
-function O({ className, children, horizontal, ref, ...rest }) {
+function O({ className, children, horizontal, ref, style, ...rest }) {
     const cn = (0, index_web_1.useCn)();
     const overflowClass = horizontal ? 'overflow-x-auto' : 'overflow-y-auto';
-    return ((0, jsx_runtime_1.jsx)("div", { ref: ref, className: cn(overflowClass, className), ...rest, children: children }));
+    return ((0, jsx_runtime_1.jsx)("div", { ref: ref, className: cn(overflowClass, className), style: style, ...rest, children: children }));
 }
 exports.Overflow = O;

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

@@ -4,10 +4,10 @@ exports.Picture = void 0;
 exports.P = P;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const index_web_1 = require("../../hooks/index.web");
-function P({ alt, className, ref, ...rest }) {
+function P({ alt, className, ref, style, ...rest }) {
     const cn = (0, index_web_1.useCn)();
     return (
     // biome-ignore lint/a11y/useAltText: <explanation>
-    (0, jsx_runtime_1.jsx)("img", { alt: alt, "aria-label": alt, ref: ref, className: cn('object-cover', className), ...rest }));
+    (0, jsx_runtime_1.jsx)("img", { alt: alt, "aria-label": alt, ref: ref, className: cn('object-cover', className), style: style, ...rest }));
 }
 exports.Picture = P;

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

@@ -2,12 +2,12 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { Pressable } from 'react-native';
 import { useAction, useCn } from '../../hooks/index.native';
 import { E } from '../e/index.native';
-export function A({ className, children, onPress, onClick, disabled, ref, ...rest }) {
+export function A({ className, children, onPress, onClick, disabled, ref, style, ...rest }) {
     const cn = useCn();
     const { onAction } = useAction({
         onClick,
         onPress,
     });
-    return (_jsx(Pressable, { ref: ref, onPress: onAction, disabled: disabled, ...rest, children: _jsx(E, { className: cn(disabled && 'opacity-60', className), children: children }) }));
+    return (_jsx(Pressable, { ref: ref, onPress: onAction, disabled: disabled, children: _jsx(E, { className: cn(disabled && 'opacity-60', className), style: style, ...rest, children: children }) }));
 }
 export const Action = A;

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

@@ -1,11 +1,11 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useAction, useCn } from '../../hooks/index.web';
-export function A({ className, children, onPress, onClick, disabled, ref, ...rest }) {
+export function A({ className, children, onPress, onClick, disabled, ref, style, ...rest }) {
     const cn = useCn();
     const { onAction } = useAction({
         onClick,
         onPress,
     });
-    return (_jsx("button", { ref: ref, type: "button", disabled: disabled, className: cn('cursor-pointer', disabled && 'opacity-60', className), onClick: onAction, ...rest, children: children }));
+    return (_jsx("button", { ref: ref, type: "button", disabled: disabled, className: cn('cursor-pointer', disabled && 'opacity-60', className), onClick: onAction, style: style, ...rest, children: children }));
 }
 export const Action = A;

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

@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { createPortal } from 'react-dom';
 import { useCn } from '../../hooks/index.web';
 import { E } from '../e/index.web';
-export function D({ open, onOpenChange, placement = 'center', className, backdropClassName, containerClassName, contentClassName, closeOnBackdropClick = true, children, ref, ...rest }) {
+export function D({ open, onOpenChange, placement = 'center', className, backdropClassName, containerClassName, contentClassName, closeOnBackdropClick = true, children, ref, style, ...rest }) {
     const cn = useCn();
     if (typeof document === 'undefined')
         return null;
@@ -26,6 +26,6 @@ export function D({ open, onOpenChange, placement = 'center', className, backdro
     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' : '', className, contentClassName);
     return createPortal(_jsx(E, { className: backdropClasses, role: "presentation", onClick: handleBackdropClick, children: _jsx("div", { ref: ref, 
             // biome-ignore lint/a11y/useSemanticElements: <explanation>
-            role: "dialog", "aria-modal": "true", className: contentClasses, ...rest, children: children }) }), document.body);
+            role: "dialog", "aria-modal": "true", className: contentClasses, style: style, ...rest, children: children }) }), document.body);
 }
 export const Dialog = D;

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

@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { View } from 'react-native';
 import { useAction, useCn } from '../../hooks/index.native';
 import { T } from '../t/index.native';
-export function E({ className, children, onPress, onClick, ref, ...rest }) {
+export function E({ className, children, onPress, onClick, ref, style, ...rest }) {
     const cn = useCn();
     const { onAction } = useAction({
         onClick,
@@ -12,6 +12,6 @@ export function E({ className, children, onPress, onClick, ref, ...rest }) {
         onAction();
         return false;
     };
-    return (_jsx(View, { ref: ref, className: cn(className), onStartShouldSetResponder: handleOnPress, ...rest, children: typeof children === 'string' ? _jsx(T, { children: children }) : children }));
+    return (_jsx(View, { ref: ref, className: cn(className), onStartShouldSetResponder: handleOnPress, style: style, ...rest, children: typeof children === 'string' ? _jsx(T, { children: children }) : children }));
 }
 export const Element = E;

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

@@ -1,11 +1,11 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useAction, useCn } from '../../hooks/index.web';
-export function E({ className, children, onPress, onClick, ref, ...rest }) {
+export function E({ className, children, onPress, onClick, ref, style, ...rest }) {
     const cn = useCn();
     const { onAction } = useAction({
         onClick,
         onPress,
     });
-    return (_jsx("div", { ref: ref, className: cn(className), onClick: onAction, ...rest, children: children }));
+    return (_jsx("div", { ref: ref, className: cn(className), onClick: onAction, style: style, ...rest, children: children }));
 }
 export const Element = E;

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

@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { TextInput } from 'react-native';
 import { useCn, useOnChange } from '../../hooks/index.native';
 import { useIUtils } from './useIUtils';
-export function I({ className, value, defaultValue, placeholder, onChange, onChangeValue, type, inputMode, keyboardType, editable, disabled, ref, ...rest }) {
+export function I({ className, value, defaultValue, placeholder, onChange, onChangeValue, type, inputMode, keyboardType, editable, disabled, ref, style, ...rest }) {
     const { treatTypeModeAndKeyboardType } = useIUtils();
     const cn = useCn();
     const { onChange: handleOnChange } = useOnChange({
@@ -21,6 +21,6 @@ export function I({ className, value, defaultValue, placeholder, onChange, onCha
         if (onChangeValue)
             onChangeValue(event.nativeEvent.text);
     };
-    return (_jsx(TextInput, { ref: ref, className: cn(!effectiveEditable && 'opacity-60', className), value: value, defaultValue: defaultValue, placeholder: placeholder, onChange: handleChange, secureTextEntry: masterInputType === 'password', keyboardType: masterInputKeyboardType, editable: effectiveEditable, ...rest }));
+    return (_jsx(TextInput, { ref: ref, className: cn(!effectiveEditable && 'opacity-60', className), value: value, defaultValue: defaultValue, placeholder: placeholder, onChange: handleChange, secureTextEntry: masterInputType === 'password', keyboardType: masterInputKeyboardType, editable: effectiveEditable, style: style, ...rest }));
 }
 export const Input = I;

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, defaultValue: defaultValue, 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/native/cjs/components/a/a.native.js

@@ -6,12 +6,12 @@ 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, ...rest }) {
+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, ...rest, children: (0, jsx_runtime_1.jsx)(index_native_2.E, { className: cn(disabled && 'opacity-60', className), children: children }) }));
+    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

@@ -4,12 +4,12 @@ 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, ...rest }) {
+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, ...rest, children: children }));
+    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/d/d.web.js

@@ -6,7 +6,7 @@ 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', className, backdropClassName, containerClassName, contentClassName, closeOnBackdropClick = true, children, ref, ...rest }) {
+function D({ open, onOpenChange, placement = 'center', className, backdropClassName, containerClassName, contentClassName, closeOnBackdropClick = true, children, ref, style, ...rest }) {
     const cn = (0, index_web_1.useCn)();
     if (typeof document === 'undefined')
         return null;
@@ -30,6 +30,6 @@ function D({ open, onOpenChange, placement = 'center', className, backdropClassN
     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' : '', className, contentClassName);
     return (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsx)(index_web_2.E, { className: backdropClasses, role: "presentation", onClick: handleBackdropClick, children: (0, jsx_runtime_1.jsx)("div", { ref: ref, 
             // biome-ignore lint/a11y/useSemanticElements: <explanation>
-            role: "dialog", "aria-modal": "true", className: contentClasses, ...rest, children: children }) }), document.body);
+            role: "dialog", "aria-modal": "true", className: contentClasses, style: style, ...rest, children: children }) }), document.body);
 }
 exports.Dialog = D;

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

@@ -6,7 +6,7 @@ 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, onPress, onClick, ref, ...rest }) {
+function E({ className, children, onPress, onClick, ref, style, ...rest }) {
     const cn = (0, index_native_1.useCn)();
     const { onAction } = (0, index_native_1.useAction)({
         onClick,
@@ -16,6 +16,6 @@ function E({ className, children, onPress, onClick, ref, ...rest }) {
         onAction();
         return false;
     };
-    return ((0, jsx_runtime_1.jsx)(react_native_1.View, { ref: ref, className: cn(className), onStartShouldSetResponder: handleOnPress, ...rest, children: typeof children === 'string' ? (0, jsx_runtime_1.jsx)(index_native_2.T, { children: children }) : children }));
+    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

@@ -4,12 +4,12 @@ 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, onPress, onClick, ref, ...rest }) {
+function E({ className, children, onPress, onClick, 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)("div", { ref: ref, className: cn(className), onClick: onAction, ...rest, children: children }));
+    return ((0, jsx_runtime_1.jsx)("div", { ref: ref, className: cn(className), onClick: onAction, style: style, ...rest, children: children }));
 }
 exports.Element = E;

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

@@ -6,7 +6,7 @@ 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, ...rest }) {
+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)({
@@ -25,6 +25,6 @@ function I({ className, value, defaultValue, placeholder, onChange, onChangeValu
         if (onChangeValue)
             onChangeValue(event.nativeEvent.text);
     };
-    return ((0, jsx_runtime_1.jsx)(react_native_1.TextInput, { ref: ref, className: cn(!effectiveEditable && 'opacity-60', className), value: value, defaultValue: defaultValue, placeholder: placeholder, onChange: handleChange, secureTextEntry: masterInputType === 'password', keyboardType: masterInputKeyboardType, editable: effectiveEditable, ...rest }));
+    return ((0, jsx_runtime_1.jsx)(react_native_1.TextInput, { ref: ref, className: cn(!effectiveEditable && 'opacity-60', className), value: value, defaultValue: defaultValue, placeholder: placeholder, onChange: handleChange, secureTextEntry: masterInputType === 'password', keyboardType: masterInputKeyboardType, editable: effectiveEditable, style: style, ...rest }));
 }
 exports.Input = I;

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

@@ -5,7 +5,7 @@ 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, ...rest }) {
+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)({
@@ -18,6 +18,6 @@ function I({ className, value, defaultValue, placeholder, onChange, onChangeValu
         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, defaultValue: defaultValue, placeholder: placeholder, onChange: handleOnChange, disabled: effectiveDisabled, ...rest }));
+    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, defaultValue: defaultValue, placeholder: placeholder, onChange: handleOnChange, disabled: effectiveDisabled, style: style, ...rest }));
 }
 exports.Input = I;

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

@@ -5,13 +5,13 @@ exports.L = L;
 const jsx_runtime_1 = require("nativewind/jsx-runtime");
 const index_native_1 = require("../../hooks/index.native");
 const index_web_1 = require("../../hooks/index.web");
-function L({ className, children, to, href, onClick, onPress, preventDefault, ref, ...rest }) {
+function L({ className, children, to, href, onClick, onPress, preventDefault, ref, style, ...rest }) {
     const cn = (0, index_web_1.useCn)();
     const { onAction } = (0, index_native_1.useAction)({
         onClick,
         onPress,
     });
     const resolvedHref = href ?? to ?? '#';
-    return ((0, jsx_runtime_1.jsx)("a", { ref: ref, href: resolvedHref, className: cn('cursor-pointer', className), onClick: onAction, ...rest, children: children }));
+    return ((0, jsx_runtime_1.jsx)("a", { ref: ref, href: resolvedHref, className: cn('cursor-pointer', className), onClick: onAction, style: style, ...rest, children: children }));
 }
 exports.Link = L;

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

@@ -4,9 +4,9 @@ exports.Overflow = void 0;
 exports.O = O;
 const jsx_runtime_1 = require("nativewind/jsx-runtime");
 const index_web_1 = require("../../hooks/index.web");
-function O({ className, children, horizontal, ref, ...rest }) {
+function O({ className, children, horizontal, ref, style, ...rest }) {
     const cn = (0, index_web_1.useCn)();
     const overflowClass = horizontal ? 'overflow-x-auto' : 'overflow-y-auto';
-    return ((0, jsx_runtime_1.jsx)("div", { ref: ref, className: cn(overflowClass, className), ...rest, children: children }));
+    return ((0, jsx_runtime_1.jsx)("div", { ref: ref, className: cn(overflowClass, className), style: style, ...rest, children: children }));
 }
 exports.Overflow = O;

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

@@ -4,10 +4,10 @@ exports.Picture = void 0;
 exports.P = P;
 const jsx_runtime_1 = require("nativewind/jsx-runtime");
 const index_web_1 = require("../../hooks/index.web");
-function P({ alt, className, ref, ...rest }) {
+function P({ alt, className, ref, style, ...rest }) {
     const cn = (0, index_web_1.useCn)();
     return (
     // biome-ignore lint/a11y/useAltText: <explanation>
-    (0, jsx_runtime_1.jsx)("img", { alt: alt, "aria-label": alt, ref: ref, className: cn('object-cover', className), ...rest }));
+    (0, jsx_runtime_1.jsx)("img", { alt: alt, "aria-label": alt, ref: ref, className: cn('object-cover', className), style: style, ...rest }));
 }
 exports.Picture = P;

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

@@ -2,12 +2,12 @@ import { jsx as _jsx } from "nativewind/jsx-runtime";
 import { Pressable } from 'react-native';
 import { useAction, useCn } from '../../hooks/index.native';
 import { E } from '../e/index.native';
-export function A({ className, children, onPress, onClick, disabled, ref, ...rest }) {
+export function A({ className, children, onPress, onClick, disabled, ref, style, ...rest }) {
     const cn = useCn();
     const { onAction } = useAction({
         onClick,
         onPress,
     });
-    return (_jsx(Pressable, { ref: ref, onPress: onAction, disabled: disabled, ...rest, children: _jsx(E, { className: cn(disabled && 'opacity-60', className), children: children }) }));
+    return (_jsx(Pressable, { ref: ref, onPress: onAction, disabled: disabled, children: _jsx(E, { className: cn(disabled && 'opacity-60', className), style: style, ...rest, children: children }) }));
 }
 export const Action = A;

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

@@ -1,11 +1,11 @@
 import { jsx as _jsx } from "nativewind/jsx-runtime";
 import { useAction, useCn } from '../../hooks/index.web';
-export function A({ className, children, onPress, onClick, disabled, ref, ...rest }) {
+export function A({ className, children, onPress, onClick, disabled, ref, style, ...rest }) {
     const cn = useCn();
     const { onAction } = useAction({
         onClick,
         onPress,
     });
-    return (_jsx("button", { ref: ref, type: "button", disabled: disabled, className: cn('cursor-pointer', disabled && 'opacity-60', className), onClick: onAction, ...rest, children: children }));
+    return (_jsx("button", { ref: ref, type: "button", disabled: disabled, className: cn('cursor-pointer', disabled && 'opacity-60', className), onClick: onAction, style: style, ...rest, children: children }));
 }
 export const Action = A;

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

@@ -2,7 +2,7 @@ import { jsx as _jsx } from "nativewind/jsx-runtime";
 import { createPortal } from 'react-dom';
 import { useCn } from '../../hooks/index.web';
 import { E } from '../e/index.web';
-export function D({ open, onOpenChange, placement = 'center', className, backdropClassName, containerClassName, contentClassName, closeOnBackdropClick = true, children, ref, ...rest }) {
+export function D({ open, onOpenChange, placement = 'center', className, backdropClassName, containerClassName, contentClassName, closeOnBackdropClick = true, children, ref, style, ...rest }) {
     const cn = useCn();
     if (typeof document === 'undefined')
         return null;
@@ -26,6 +26,6 @@ export function D({ open, onOpenChange, placement = 'center', className, backdro
     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' : '', className, contentClassName);
     return createPortal(_jsx(E, { className: backdropClasses, role: "presentation", onClick: handleBackdropClick, children: _jsx("div", { ref: ref, 
             // biome-ignore lint/a11y/useSemanticElements: <explanation>
-            role: "dialog", "aria-modal": "true", className: contentClasses, ...rest, children: children }) }), document.body);
+            role: "dialog", "aria-modal": "true", className: contentClasses, style: style, ...rest, children: children }) }), document.body);
 }
 export const Dialog = D;

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

@@ -2,7 +2,7 @@ import { jsx as _jsx } from "nativewind/jsx-runtime";
 import { View } from 'react-native';
 import { useAction, useCn } from '../../hooks/index.native';
 import { T } from '../t/index.native';
-export function E({ className, children, onPress, onClick, ref, ...rest }) {
+export function E({ className, children, onPress, onClick, ref, style, ...rest }) {
     const cn = useCn();
     const { onAction } = useAction({
         onClick,
@@ -12,6 +12,6 @@ export function E({ className, children, onPress, onClick, ref, ...rest }) {
         onAction();
         return false;
     };
-    return (_jsx(View, { ref: ref, className: cn(className), onStartShouldSetResponder: handleOnPress, ...rest, children: typeof children === 'string' ? _jsx(T, { children: children }) : children }));
+    return (_jsx(View, { ref: ref, className: cn(className), onStartShouldSetResponder: handleOnPress, style: style, ...rest, children: typeof children === 'string' ? _jsx(T, { children: children }) : children }));
 }
 export const Element = E;

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

@@ -1,11 +1,11 @@
 import { jsx as _jsx } from "nativewind/jsx-runtime";
 import { useAction, useCn } from '../../hooks/index.web';
-export function E({ className, children, onPress, onClick, ref, ...rest }) {
+export function E({ className, children, onPress, onClick, ref, style, ...rest }) {
     const cn = useCn();
     const { onAction } = useAction({
         onClick,
         onPress,
     });
-    return (_jsx("div", { ref: ref, className: cn(className), onClick: onAction, ...rest, children: children }));
+    return (_jsx("div", { ref: ref, className: cn(className), onClick: onAction, style: style, ...rest, children: children }));
 }
 export const Element = E;

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

@@ -2,7 +2,7 @@ import { jsx as _jsx } from "nativewind/jsx-runtime";
 import { TextInput } from 'react-native';
 import { useCn, useOnChange } from '../../hooks/index.native';
 import { useIUtils } from './useIUtils';
-export function I({ className, value, defaultValue, placeholder, onChange, onChangeValue, type, inputMode, keyboardType, editable, disabled, ref, ...rest }) {
+export function I({ className, value, defaultValue, placeholder, onChange, onChangeValue, type, inputMode, keyboardType, editable, disabled, ref, style, ...rest }) {
     const { treatTypeModeAndKeyboardType } = useIUtils();
     const cn = useCn();
     const { onChange: handleOnChange } = useOnChange({
@@ -21,6 +21,6 @@ export function I({ className, value, defaultValue, placeholder, onChange, onCha
         if (onChangeValue)
             onChangeValue(event.nativeEvent.text);
     };
-    return (_jsx(TextInput, { ref: ref, className: cn(!effectiveEditable && 'opacity-60', className), value: value, defaultValue: defaultValue, placeholder: placeholder, onChange: handleChange, secureTextEntry: masterInputType === 'password', keyboardType: masterInputKeyboardType, editable: effectiveEditable, ...rest }));
+    return (_jsx(TextInput, { ref: ref, className: cn(!effectiveEditable && 'opacity-60', className), value: value, defaultValue: defaultValue, placeholder: placeholder, onChange: handleChange, secureTextEntry: masterInputType === 'password', keyboardType: masterInputKeyboardType, editable: effectiveEditable, style: style, ...rest }));
 }
 export const Input = I;