@react-xp/aeiou 0.1.0-rc.1

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

@@ -0,0 +1,71 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useInteractiveState = useInteractiveState;
+const react_1 = require("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),
+    };
+}
+function useInteractiveState(options = {}) {
+    const { disabled = false } = options;
+    const [state, setState] = (0, react_1.useState)({
+        hovered: false,
+        pressed: false,
+        focused: false,
+        disabled,
+    });
+    (0, react_1.useEffect)(() => {
+        setState((prev) => ({ ...prev, disabled }));
+    }, [disabled]);
+    const eventHandlers = (0, react_1.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: () => {
+            if (disabled)
+                return;
+            setState((prev) => ({ ...prev, focused: true }));
+        },
+        onBlur: () => {
+            if (disabled)
+                return;
+            setState((prev) => ({ ...prev, focused: false, pressed: false }));
+        },
+    }), [disabled]);
+    const dataAttrs = toDataAttrs(state);
+    return { state, dataAttrs, eventHandlers };
+}

package/dist/cjs/hooks/useOnChange.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useOnChange = void 0;
+const react_1 = require("react");
+const useOnChange = ({ onChange, onChangeValue }) => {
+    return (0, react_1.useMemo)(() => ({
+        onChange: (event) => {
+            if (onChange) {
+                onChange(event);
+                return;
+            }
+            if (onChangeValue) {
+                onChangeValue(event?.target?.value);
+            }
+        },
+    }), [onChange, onChangeValue]);
+};
+exports.useOnChange = useOnChange;

package/dist/cjs/hooks/useProps.js

@@ -0,0 +1,66 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useProps = void 0;
+const react_1 = __importDefault(require("react"));
+const useProps = () => {
+    const handleOmit = react_1.default.useCallback((obj = {}, keys = []) => {
+        if (!obj) {
+            return {
+                props: {},
+                restProps: {},
+            };
+        }
+        // biome-ignore lint/suspicious/noExplicitAny: <explanation>
+        const result = {};
+        // biome-ignore lint/suspicious/noExplicitAny: <explanation>
+        const nonUsedProps = {};
+        for (const key of Object.keys(obj)) {
+            if (!keys.includes(key)) {
+                result[key] = obj[key];
+            }
+            else {
+                nonUsedProps[key] = obj[key];
+            }
+        }
+        return {
+            props: result,
+            restProps: nonUsedProps,
+        };
+    }, []);
+    const handlePick = react_1.default.useCallback((obj = {}, keys = []) => {
+        if (!obj) {
+            return {
+                props: {},
+                restProps: {},
+            };
+        }
+        // biome-ignore lint/suspicious/noExplicitAny: <explanation>
+        const result = {};
+        // biome-ignore lint/suspicious/noExplicitAny: <explanation>
+        const nonUsedProps = {};
+        for (const key of Object.keys(obj)) {
+            if (keys.includes(key)) {
+                result[key] = obj[key];
+            }
+            else {
+                nonUsedProps[key] = obj[key];
+            }
+        }
+        return {
+            props: result /*Pick<
+              TObject,
+              Exclude<keyof TObject, Exclude<keyof TObject, TKeys>>
+            >*/,
+            restProps: nonUsedProps,
+        };
+    }, []);
+    return {
+        getPropKey: (obj = {}) => handlePick(obj, ['key']),
+        omitProps: handleOmit,
+        pickProps: handlePick,
+    };
+};
+exports.useProps = useProps;

package/dist/cjs/index.js

@@ -0,0 +1,19 @@
+"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("./components/index.web"), exports);
+__exportStar(require("./hooks/index.web"), exports);
+__exportStar(require("./types"), exports);

package/dist/cjs/index.native.js

@@ -0,0 +1,19 @@
+"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("./components/index.native"), exports);
+__exportStar(require("./hooks/index.native"), exports);
+__exportStar(require("./types"), exports);

package/dist/cjs/index.web.js

@@ -0,0 +1,19 @@
+"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("./components/index.web"), exports);
+__exportStar(require("./hooks/index.web"), exports);
+__exportStar(require("./types"), exports);

package/dist/cjs/types/base.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/types/index.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("./base"), exports);

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

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

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

@@ -0,0 +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 }) {
+    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 }));
+}
+export const Action = A;

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

@@ -0,0 +1 @@
+export * from './a.native';

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

@@ -0,0 +1 @@
+export * from './a.web';

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

@@ -0,0 +1,24 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Modal } from 'react-native';
+import { useCn } from '../../hooks/index.native';
+import { E } from '../e/index.native';
+export function D({ open, onOpenChange, placement = 'center', className, backdropClassName, containerClassName, contentClassName, children, ref, ...rest }) {
+    const cn = 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' : '', className, contentClassName);
+    const handleRequestClose = (e) => {
+        onOpenChange?.(false);
+        if (typeof rest.onRequestClose === 'function') {
+            rest.onRequestClose?.(e);
+        }
+    };
+    return (_jsx(Modal, { visible: open, animationType: "slide", transparent: true, onRequestClose: handleRequestClose, ...rest, children: _jsx(E, { className: containerClasses, children: _jsx(E, { ref: ref, className: contentClasses, children: children }) }) }));
+}
+export const Dialog = D;

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

@@ -0,0 +1,29 @@
+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 }) {
+    const cn = 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' : '', className, contentClassName);
+    return createPortal(_jsx(E, { className: backdropClasses, role: "presentation", onClick: handleBackdropClick, children: _jsx("dialog", { ref: ref, "aria-modal": "true", className: contentClasses, ...rest, children: children }) }), document.body);
+}
+export const Dialog = D;

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

@@ -0,0 +1 @@
+export * from './d.native';

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

@@ -0,0 +1 @@
+export * from './d.web';

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

@@ -0,0 +1,16 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { View } from 'react-native';
+import { useAction, useCn } from '../../hooks/index.native';
+export function E({ className, children, onPress, onClick, ref, ...rest }) {
+    const cn = useCn();
+    const { onAction } = useAction({
+        onClick,
+        onPress,
+    });
+    const handleOnPress = () => {
+        onAction();
+        return false;
+    };
+    return (_jsx(View, { ref: ref, className: cn(className), onStartShouldSetResponder: handleOnPress, ...rest, children: children }));
+}
+export const Element = E;

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

@@ -0,0 +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 }) {
+    const cn = useCn();
+    const { onAction } = useAction({
+        onClick,
+        onPress,
+    });
+    return (_jsx("div", { ref: ref, className: cn(className), onClick: onAction, ...rest, children: children }));
+}
+export const Element = E;

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

@@ -0,0 +1 @@
+export * from './e.native';

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

@@ -0,0 +1 @@
+export * from './e.web';

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

@@ -0,0 +1,26 @@
+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 }) {
+    const { treatTypeModeAndKeyboardType } = useIUtils();
+    const cn = useCn();
+    const { onChange: handleOnChange } = useOnChange({
+        onChange,
+        onChangeValue,
+    });
+    const effectiveEditable = editable ?? !disabled;
+    const { masterInputType, masterInputKeyboardType } = treatTypeModeAndKeyboardType({
+        inputMode,
+        keyboardType,
+        type,
+    });
+    const handleChange = (event) => {
+        if (onChange)
+            onChange(event);
+        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 }));
+}
+export const Input = I;

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

@@ -0,0 +1,19 @@
+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 }) {
+    const { treatTypeModeAndKeyboardType } = useIUtils();
+    const cn = useCn();
+    const { onChange: handleOnChange } = useOnChange({
+        onChange,
+        onChangeValue,
+    });
+    const effectiveDisabled = disabled || editable === false;
+    const { masterInputType, masterInputMode } = treatTypeModeAndKeyboardType({
+        inputMode,
+        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 }));
+}
+export const Input = I;

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

@@ -0,0 +1 @@
+export * from './i.native';

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

@@ -0,0 +1 @@
+export * from './i.web';

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

@@ -0,0 +1,67 @@
+const setWhenUndefined = (value, defaultValue) => {
+    return value === undefined ? defaultValue : value;
+};
+const treatTypeModeAndKeyboardType = ({ inputMode, keyboardType, type, }) => {
+    let masterInputKeyboardType = keyboardType;
+    let masterInputMode = inputMode;
+    let masterInputType = type;
+    // set values according to inputMode first
+    if (masterInputMode === 'numeric' || masterInputMode === 'decimal') {
+        masterInputKeyboardType = setWhenUndefined(masterInputKeyboardType, 'numeric');
+        masterInputType = setWhenUndefined(masterInputType, 'number');
+    }
+    else if (masterInputMode === 'email') {
+        masterInputKeyboardType = setWhenUndefined(masterInputKeyboardType, 'email-address');
+        masterInputType = setWhenUndefined(masterInputType, 'email');
+    }
+    else if (masterInputMode === 'search') {
+        masterInputKeyboardType = setWhenUndefined(masterInputKeyboardType, 'default');
+        masterInputType = setWhenUndefined(masterInputType, 'search');
+    }
+    else if (masterInputMode === 'tel') {
+        masterInputKeyboardType = setWhenUndefined(masterInputKeyboardType, 'phone-pad');
+        masterInputType = setWhenUndefined(masterInputType, 'tel');
+    }
+    else if (masterInputMode === 'url') {
+        masterInputKeyboardType = setWhenUndefined(masterInputKeyboardType, 'url');
+        masterInputType = setWhenUndefined(masterInputType, 'url');
+    }
+    else if (masterInputType === 'text') {
+        masterInputKeyboardType = setWhenUndefined(masterInputKeyboardType, 'default');
+        masterInputType = setWhenUndefined(masterInputType, 'text');
+    }
+    // set values according to keyboardType second
+    if (masterInputKeyboardType === 'email-address') {
+        masterInputMode = setWhenUndefined(masterInputMode, 'email');
+        masterInputType = setWhenUndefined(masterInputType, 'email');
+    }
+    else if (masterInputKeyboardType === 'numeric' ||
+        masterInputKeyboardType === 'decimal-pad') {
+        masterInputMode = setWhenUndefined(masterInputMode, 'numeric');
+        masterInputType = setWhenUndefined(masterInputType, 'number');
+    }
+    else if (masterInputKeyboardType === 'phone-pad') {
+        masterInputMode = setWhenUndefined(masterInputMode, 'tel');
+        masterInputType = setWhenUndefined(masterInputType, 'tel');
+    }
+    else if (masterInputKeyboardType === 'url') {
+        masterInputMode = setWhenUndefined(masterInputMode, 'url');
+        masterInputType = setWhenUndefined(masterInputType, 'url');
+    }
+    else if (masterInputKeyboardType === 'default') {
+        masterInputMode = setWhenUndefined(masterInputMode, 'text');
+        masterInputType = setWhenUndefined(masterInputType, 'text');
+    }
+    // finally, set default type if still undefined
+    masterInputType = setWhenUndefined(masterInputType, 'text');
+    return {
+        masterInputKeyboardType,
+        masterInputMode,
+        masterInputType,
+    };
+};
+export const useIUtils = () => {
+    return {
+        treatTypeModeAndKeyboardType,
+    };
+};

package/dist/esm/components/index.js

@@ -0,0 +1,10 @@
+export * from './a/index.web';
+export * from './d/index.web';
+export * from './e/index.web';
+export * from './i/index.web';
+export * from './l/index.web';
+export * from './o/index.web';
+export * from './p/index.web';
+export * from './s/index.web';
+export * from './t/index.web';
+export * from './u/index.web';

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

@@ -0,0 +1,10 @@
+export * from './a/index.native';
+export * from './d/index.native';
+export * from './e/index.native';
+export * from './i/index.native';
+export * from './l/index.native';
+export * from './o/index.native';
+export * from './p/index.native';
+export * from './s/index.native';
+export * from './t/index.native';
+export * from './u/index.native';

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

@@ -0,0 +1,10 @@
+export * from './a/index.web';
+export * from './d/index.web';
+export * from './e/index.web';
+export * from './i/index.web';
+export * from './l/index.web';
+export * from './o/index.web';
+export * from './p/index.web';
+export * from './s/index.web';
+export * from './t/index.web';
+export * from './u/index.web';

package/dist/esm/components/l/index.native.js

@@ -0,0 +1 @@
+export * from './l.native';

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

@@ -0,0 +1 @@
+export * from './l.web';

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

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { A } from '../a/index.native';
+export function L(props) {
+    return _jsx(A, { ...props });
+}
+export const Link = L;

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

@@ -0,0 +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 }) {
+    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 }));
+}
+export const Link = L;

package/dist/esm/components/o/index.native.js

@@ -0,0 +1 @@
+export * from './o.native';

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

@@ -0,0 +1 @@
+export * from './o.web';

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

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ScrollView } from 'react-native';
+import { useCn } from '../../hooks/index.native';
+export function O({ className, children, horizontal, ref, ...rest }) {
+    const cn = useCn();
+    return (_jsx(ScrollView, { ref: ref, className: cn(className), horizontal: horizontal, ...rest, children: children }));
+}
+export const Overflow = O;

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

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useCn } from '../../hooks/index.web';
+export function O({ className, children, horizontal, ref, ...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 }));
+}
+export const Overflow = O;

package/dist/esm/components/p/index.native.js

@@ -0,0 +1 @@
+export * from './p.native';

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

@@ -0,0 +1 @@
+export * from './p.web';

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

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Image } from 'react-native';
+import { useCn } from '../../hooks/index.native';
+export function P({ className, src, source, ref, ...rest }) {
+    const cn = useCn();
+    const finalSource = src != null ? { uri: src } : source;
+    return (_jsx(Image, { ref: ref, className: cn(className), source: finalSource, ...rest }));
+}
+export const Picture = P;

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

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useCn } from '../../hooks/index.web';
+export function P({ alt, className, ref, ...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 }));
+}
+export const Picture = P;

package/dist/esm/components/s/index.native.js

@@ -0,0 +1 @@
+export * from './s.native';

package/dist/esm/components/s/index.web.js

@@ -0,0 +1 @@
+export * from './s.web';

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

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { SafeAreaView, } from 'react-native-safe-area-context';
+import { useCn } from '../../hooks/index.native';
+export function S({ className, children, ref, ...rest }) {
+    const cn = useCn();
+    return (_jsx(SafeAreaView, { ref: ref, className: cn(className), ...rest, children: children }));
+}

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

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { E } from '../e/index.web';
+export function S(props) {
+    return _jsx(E, { ...props });
+}
+export const Safe = S;

package/dist/esm/components/t/index.native.js

@@ -0,0 +1 @@
+export * from './t.native';