@lichens-innovation/react-native-common 3.2.0 → 3.3.1

package/dist/components/layout/index.d.ts

@@ -1,3 +1,4 @@
 export * from './full-centered';
+export * from './orientation-aware-tabs/';
 export * from './resizable/';
 export * from './safe-container';

package/dist/components/layout/index.js

@@ -1,4 +1,5 @@
 export * from './full-centered';
+export * from './orientation-aware-tabs/';
 export * from './resizable/';
 export * from './safe-container';
 //# sourceMappingURL=index.js.map

package/dist/components/layout/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/layout/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/layout/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC"}

package/dist/components/layout/orientation-aware-tabs/index.d.ts

@@ -0,0 +1,2 @@
+export * from './orientation-aware-tab-button';
+export * from './orientation-aware-tabs-layout';

package/dist/components/layout/orientation-aware-tabs/index.js

@@ -0,0 +1,3 @@
+export * from './orientation-aware-tab-button';
+export * from './orientation-aware-tabs-layout';
+//# sourceMappingURL=index.js.map

package/dist/components/layout/orientation-aware-tabs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/layout/orientation-aware-tabs/index.ts"],"names":[],"mappings":"AAAA,cAAc,gCAAgC,CAAC;AAC/C,cAAc,iCAAiC,CAAC"}

package/dist/components/layout/orientation-aware-tabs/orientation-aware-tab-button.d.ts

@@ -0,0 +1,9 @@
+import { TabTriggerSlotProps } from 'expo-router/ui';
+import { FunctionComponent } from 'react';
+export type OrientationAwareTabButtonProps = TabTriggerSlotProps & {
+    icon: string;
+    title: string;
+    activeColor: string;
+    isLabelHidden?: boolean;
+};
+export declare const OrientationAwareTabButton: FunctionComponent<OrientationAwareTabButtonProps>;

package/dist/components/layout/orientation-aware-tabs/orientation-aware-tab-button.js

@@ -0,0 +1,40 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Pressable, StyleSheet } from 'react-native';
+import { Text } from 'react-native-paper';
+import { useIsLandscape } from '../../../hooks/use-window-orientation';
+import { useAppTheme } from '../../../theme/theme';
+import { TabBarIcon } from '../../tab-bar-icon';
+export const OrientationAwareTabButton = (_a) => {
+    var { icon, title, activeColor, isFocused, isLabelHidden = false } = _a, props = __rest(_a, ["icon", "title", "activeColor", "isFocused", "isLabelHidden"]);
+    const theme = useAppTheme();
+    const styles = useStyles();
+    const isLabelVisible = !isLabelHidden;
+    const color = isFocused ? activeColor : theme.colors.onSurfaceDisabled;
+    return (_jsxs(Pressable, Object.assign({}, props, { style: [styles.tabButton], children: [_jsx(TabBarIcon, { name: icon, color: color }), isLabelVisible && (_jsx(Text, { variant: "bodySmall", style: { color }, children: title }))] })));
+};
+const useStyles = () => {
+    const theme = useAppTheme();
+    const isLandscape = useIsLandscape();
+    const padding = theme.spacing(0.5);
+    return StyleSheet.create({
+        tabButton: {
+            flex: 1,
+            alignItems: 'center',
+            justifyContent: 'center',
+            paddingLeft: isLandscape ? padding : 0,
+            paddingTop: isLandscape ? 0 : padding,
+        },
+    });
+};
+//# sourceMappingURL=orientation-aware-tab-button.js.map

package/dist/components/layout/orientation-aware-tabs/orientation-aware-tab-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"orientation-aware-tab-button.js","sourceRoot":"","sources":["../../../../src/components/layout/orientation-aware-tabs/orientation-aware-tab-button.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAEA,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAC1C,OAAO,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AACvE,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAShD,MAAM,CAAC,MAAM,yBAAyB,GAAsD,CAAC,EAO5F,EAAE,EAAE;QAPwF,EAC3F,IAAI,EACJ,KAAK,EACL,WAAW,EACX,SAAS,EACT,aAAa,GAAG,KAAK,OAEtB,EADI,KAAK,cANmF,8DAO5F,CADS;IAER,MAAM,KAAK,GAAG,WAAW,EAAE,CAAC;IAC5B,MAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IAC3B,MAAM,cAAc,GAAY,CAAC,aAAa,CAAC;IAC/C,MAAM,KAAK,GAAG,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,iBAAiB,CAAC;IAEvE,OAAO,CACL,MAAC,SAAS,oBAAK,KAAK,IAAE,KAAK,EAAE,CAAC,MAAM,CAAC,SAAS,CAAC,aAC7C,KAAC,UAAU,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,GAAI,EAEvC,cAAc,IAAI,CACjB,KAAC,IAAI,IAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,YACvC,KAAK,GACD,CACR,KACS,CACb,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,KAAK,GAAG,WAAW,EAAE,CAAC;IAC5B,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IACrC,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;IAEnC,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,SAAS,EAAE;YACT,IAAI,EAAE,CAAC;YACP,UAAU,EAAE,QAAQ;YACpB,cAAc,EAAE,QAAQ;YACxB,WAAW,EAAE,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;YACtC,UAAU,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO;SACtC;KACF,CAAC,CAAC;AACL,CAAC,CAAC"}

package/dist/components/layout/orientation-aware-tabs/orientation-aware-tabs-layout.d.ts

@@ -0,0 +1,15 @@
+import { FunctionComponent } from 'react';
+import { ViewStyle } from 'react-native';
+export type TabItem = {
+    name: string;
+    href: string;
+    title: string;
+    icon: string;
+};
+export type OrientationAwareTabsLayoutProps = {
+    tabs: TabItem[];
+    activeColor?: string;
+    containerStyle?: ViewStyle;
+    tabListStyle?: ViewStyle;
+};
+export declare const OrientationAwareTabsLayout: FunctionComponent<OrientationAwareTabsLayoutProps>;

package/dist/components/layout/orientation-aware-tabs/orientation-aware-tabs-layout.js

@@ -0,0 +1,40 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { TabList, Tabs, TabSlot, TabTrigger } from 'expo-router/ui';
+import { StyleSheet } from 'react-native';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import { useIsLandscape } from '../../../hooks/use-window-orientation';
+import { useAppTheme } from '../../../theme/theme';
+import { OrientationAwareTabButton } from './orientation-aware-tab-button';
+export const OrientationAwareTabsLayout = ({ tabs, activeColor, containerStyle, tabListStyle, }) => {
+    const theme = useAppTheme();
+    const styles = useStyles();
+    const isLandscape = useIsLandscape();
+    return (_jsxs(Tabs, { style: [styles.tabsContainer, containerStyle], children: [_jsx(TabSlot, { style: styles.tabSlot }), _jsx(TabList, { style: [styles.tabList, tabListStyle], children: tabs.map((tab) => (_jsx(TabTrigger, { name: tab.name, href: tab.href, asChild: true, children: _jsx(OrientationAwareTabButton, { isLabelHidden: isLandscape, icon: tab.icon, title: tab.title, activeColor: activeColor !== null && activeColor !== void 0 ? activeColor : theme.colors.primary }) }, tab.name))) })] }));
+};
+const useStyles = () => {
+    const theme = useAppTheme();
+    const { bottom, right } = useSafeAreaInsets();
+    const minPadding = theme.spacing(0.5);
+    const isLandscape = useIsLandscape();
+    return StyleSheet.create({
+        tabsContainer: {
+            flex: 1,
+            flexDirection: isLandscape ? 'row' : 'column',
+        },
+        tabSlot: {
+            flex: 1,
+        },
+        tabList: {
+            backgroundColor: theme.colors.elevation.level1,
+            justifyContent: 'space-around',
+            flexDirection: isLandscape ? 'column' : 'row',
+            paddingBottom: isLandscape ? minPadding : bottom,
+            paddingRight: isLandscape ? right : minPadding,
+            borderTopWidth: isLandscape ? undefined : StyleSheet.hairlineWidth,
+            borderTopColor: isLandscape ? undefined : theme.colors.outline,
+            borderLeftWidth: isLandscape ? StyleSheet.hairlineWidth : undefined,
+            borderLeftColor: isLandscape ? theme.colors.outline : undefined,
+        }
+    });
+};
+//# sourceMappingURL=orientation-aware-tabs-layout.js.map

package/dist/components/layout/orientation-aware-tabs/orientation-aware-tabs-layout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"orientation-aware-tabs-layout.js","sourceRoot":"","sources":["../../../../src/components/layout/orientation-aware-tabs/orientation-aware-tabs-layout.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAEpE,OAAO,EAAE,UAAU,EAAa,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AACvE,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAC;AAgB3E,MAAM,CAAC,MAAM,0BAA0B,GAAuD,CAAC,EAC7F,IAAI,EACJ,WAAW,EACX,cAAc,EACd,YAAY,GACb,EAAE,EAAE;IACH,MAAM,KAAK,GAAG,WAAW,EAAE,CAAC;IAC5B,MAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IAC3B,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IAErC,OAAO,CACL,MAAC,IAAI,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,aAAa,EAAE,cAAc,CAAC,aACjD,KAAC,OAAO,IAAC,KAAK,EAAE,MAAM,CAAC,OAAO,GAAI,EAElC,KAAC,OAAO,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,OAAO,EAAE,YAAY,CAAC,YAC3C,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CACjB,KAAC,UAAU,IAAgB,IAAI,EAAE,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,GAAG,CAAC,IAAI,EAAE,OAAO,kBAChE,KAAC,yBAAyB,IACxB,aAAa,EAAE,WAAW,EAC1B,IAAI,EAAE,GAAG,CAAC,IAAI,EACd,KAAK,EAAE,GAAG,CAAC,KAAK,EAChB,WAAW,EAAE,WAAW,aAAX,WAAW,cAAX,WAAW,GAAI,KAAK,CAAC,MAAM,CAAC,OAAO,GAChD,IANa,GAAG,CAAC,IAAI,CAOZ,CACd,CAAC,GACM,IACL,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,KAAK,GAAG,WAAW,EAAE,CAAC;IAC5B,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,iBAAiB,EAAE,CAAC;IAE9C,MAAM,UAAU,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;IAEtC,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IAErC,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,aAAa,EAAE;YACb,IAAI,EAAE,CAAC;YACP,aAAa,EAAE,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ;SAC9C;QACD,OAAO,EAAE;YACP,IAAI,EAAE,CAAC;SACR;QACD,OAAO,EAAE;YACP,eAAe,EAAE,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,MAAM;YAC9C,cAAc,EAAE,cAAc;YAC9B,aAAa,EAAE,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK;YAC7C,aAAa,EAAE,WAAW,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM;YAChD,YAAY,EAAE,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU;YAC9C,cAAc,EAAE,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,aAAa;YAClE,cAAc,EAAE,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO;YAC9D,eAAe,EAAE,WAAW,CAAC,CAAC,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS;YACnE,eAAe,EAAE,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS;SAChE;KACF,CAAC,CAAC;AACL,CAAC,CAAC"}

package/dist/components/layout/resizable/horizontal-resizable-split-view.d.ts

@@ -0,0 +1,3 @@
+import { type FunctionComponent } from 'react';
+import { HorizontalResizableSplitViewProps } from './horizontal-resizable-split-view.types';
+export declare const HorizontalResizableSplitView: FunctionComponent<HorizontalResizableSplitViewProps>;

package/dist/components/layout/resizable/horizontal-resizable-split-view.js

@@ -0,0 +1,80 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useState } from 'react';
+import { StyleSheet, View } from 'react-native';
+import { Gesture, GestureDetector } from 'react-native-gesture-handler';
+import Animated, { useAnimatedStyle, useSharedValue, withSpring } from 'react-native-reanimated';
+import { isDevelopment } from '../../../utils';
+import { validateResizableSplitViewProps } from './horizontal-resizable-split-view.utils';
+const DRAG_HANDLE_WIDTH = 20;
+const DEFAULT_ANIMATION_CONFIG = { damping: 25, stiffness: 300, mass: 0.8 };
+export const HorizontalResizableSplitView = (props) => {
+    if (isDevelopment())
+        validateResizableSplitViewProps(props);
+    const { leftContent, rightContent, initialLeftRatio = 0.5, minLeftRatio = 0.15, maxLeftRatio = 0.85, handleContainerStyle, handleStyle, hideHandle = false, } = props;
+    // Track measured container width
+    const [isReady, setIsReady] = useState(false);
+    // Shared values for animation
+    const leftSectionWidth = useSharedValue(0);
+    const minWidth = useSharedValue(0);
+    const maxWidth = useSharedValue(0);
+    const startX = useSharedValue(0);
+    const isDragging = useSharedValue(false);
+    // Handle container layout measurement
+    const handleLayout = useCallback((event) => {
+        const { width } = event.nativeEvent.layout;
+        if (width > 0 && !isReady) {
+            minWidth.value = width * minLeftRatio;
+            maxWidth.value = width * maxLeftRatio;
+            leftSectionWidth.value = width * initialLeftRatio;
+            setIsReady(true);
+        }
+    }, [minLeftRatio, maxLeftRatio, initialLeftRatio, minWidth, maxWidth, leftSectionWidth, isReady]);
+    const panGesture = Gesture.Pan()
+        .onStart(() => {
+        startX.value = leftSectionWidth.value;
+        isDragging.value = true;
+    })
+        .onUpdate((event) => {
+        const newWidth = startX.value + event.translationX;
+        leftSectionWidth.value = Math.max(minWidth.value, Math.min(newWidth, maxWidth.value));
+    })
+        .onEnd(() => {
+        isDragging.value = false;
+    });
+    const leftSectionAnimatedStyle = useAnimatedStyle(() => ({ width: leftSectionWidth.value }));
+    const dragHandleContainerAnimatedStyle = useAnimatedStyle(() => ({
+        left: leftSectionWidth.value - DRAG_HANDLE_WIDTH / 2,
+    }));
+    const dragHandleAnimatedStyle = useAnimatedStyle(() => ({
+        transform: [{ scale: withSpring(isDragging.value ? 1.2 : 1, DEFAULT_ANIMATION_CONFIG) }],
+    }));
+    return (_jsxs(View, { style: [styles.container], onLayout: handleLayout, children: [_jsx(Animated.View, { style: [styles.leftSection, leftSectionAnimatedStyle], children: leftContent }), !hideHandle && (_jsx(GestureDetector, { gesture: panGesture, children: _jsx(Animated.View, { style: [styles.handleContainer, handleContainerStyle, dragHandleContainerAnimatedStyle], children: _jsx(Animated.View, { style: [styles.handle, handleStyle, dragHandleAnimatedStyle] }) }) })), _jsx(View, { style: [styles.rightSection], children: rightContent })] }));
+};
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+        flexDirection: 'row',
+    },
+    leftSection: {
+        overflow: 'hidden',
+    },
+    rightSection: {
+        flex: 1,
+        overflow: 'hidden',
+    },
+    handleContainer: {
+        position: 'absolute',
+        top: 0,
+        bottom: 0,
+        width: DRAG_HANDLE_WIDTH,
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+    handle: {
+        width: 4,
+        height: 40,
+        backgroundColor: '#888888',
+        borderRadius: 2,
+    },
+});
+//# sourceMappingURL=horizontal-resizable-split-view.js.map

package/dist/components/layout/resizable/horizontal-resizable-split-view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"horizontal-resizable-split-view.js","sourceRoot":"","sources":["../../../../src/components/layout/resizable/horizontal-resizable-split-view.tsx"],"names":[],"mappings":"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"}

package/dist/components/layout/resizable/horizontal-resizable-split-view.types.d.ts

@@ -0,0 +1,20 @@
+import { ReactNode } from 'react';
+import { StyleProp, ViewStyle } from 'react-native';
+export interface HorizontalResizableSplitViewProps {
+    /** Content to display in the left section */
+    leftContent: ReactNode;
+    /** Content to display in the right section */
+    rightContent: ReactNode;
+    /** Initial proportion for the left section (0 to 1). Default: 0.5 */
+    initialLeftRatio?: number;
+    /** Minimum proportion for the left section (0 to 1). Default: 0.15 */
+    minLeftRatio?: number;
+    /** Maximum proportion for the left section (0 to 1). Default: 0.85 */
+    maxLeftRatio?: number;
+    /** Style for the drag handle container */
+    handleContainerStyle?: StyleProp<ViewStyle>;
+    /** Style for the drag handle bar */
+    handleStyle?: StyleProp<ViewStyle>;
+    /** Whether to hide the drag handle. Default: false */
+    hideHandle?: boolean;
+}

package/dist/components/layout/resizable/horizontal-resizable-split-view.types.js

@@ -0,0 +1 @@
+//# sourceMappingURL=horizontal-resizable-split-view.types.js.map

package/dist/components/layout/resizable/horizontal-resizable-split-view.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"horizontal-resizable-split-view.types.js","sourceRoot":"","sources":["../../../../src/components/layout/resizable/horizontal-resizable-split-view.types.ts"],"names":[],"mappings":""}

package/dist/components/layout/resizable/horizontal-resizable-split-view.utils.d.ts

@@ -0,0 +1,2 @@
+import { HorizontalResizableSplitViewProps } from './horizontal-resizable-split-view.types';
+export declare const validateResizableSplitViewProps: (props: HorizontalResizableSplitViewProps) => void;

package/dist/components/layout/resizable/horizontal-resizable-split-view.utils.js

@@ -0,0 +1,23 @@
+import { isNullish } from '@lichens-innovation/ts-common';
+export const validateResizableSplitViewProps = (props) => {
+    const { initialLeftRatio, minLeftRatio, maxLeftRatio } = props;
+    if (!isNullish(initialLeftRatio)) {
+        if (initialLeftRatio < 0 || initialLeftRatio > 1)
+            throw new Error(`initialLeftRatio must be between 0 and 1. Provided: ${initialLeftRatio}`);
+    }
+    if (!isNullish(minLeftRatio)) {
+        if (minLeftRatio < 0 || minLeftRatio > 1)
+            throw new Error(`minLeftRatio must be between 0 and 1. Provided: ${minLeftRatio}`);
+    }
+    if (!isNullish(maxLeftRatio)) {
+        if (maxLeftRatio < 0 || maxLeftRatio > 1)
+            throw new Error(`maxLeftRatio must be between 0 and 1. Provided: ${maxLeftRatio}`);
+    }
+    if (!isNullish(minLeftRatio) && !isNullish(maxLeftRatio) && minLeftRatio >= maxLeftRatio)
+        throw new Error(`minLeftRatio must be less than maxLeftRatio. Provided: ${JSON.stringify({ minLeftRatio, maxLeftRatio })}`);
+    if (!isNullish(initialLeftRatio) && !isNullish(minLeftRatio) && initialLeftRatio < minLeftRatio)
+        throw new Error(`initialLeftRatio must be >= minLeftRatio. Provided: ${JSON.stringify({ initialLeftRatio, minLeftRatio })}`);
+    if (!isNullish(initialLeftRatio) && !isNullish(maxLeftRatio) && initialLeftRatio > maxLeftRatio)
+        throw new Error(`initialLeftRatio must be <= maxLeftRatio. Provided: ${JSON.stringify({ initialLeftRatio, maxLeftRatio })}`);
+};
+//# sourceMappingURL=horizontal-resizable-split-view.utils.js.map

package/dist/components/layout/resizable/horizontal-resizable-split-view.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"horizontal-resizable-split-view.utils.js","sourceRoot":"","sources":["../../../../src/components/layout/resizable/horizontal-resizable-split-view.utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,+BAA+B,CAAC;AAG1D,MAAM,CAAC,MAAM,+BAA+B,GAAG,CAAC,KAAwC,EAAE,EAAE;IAC1F,MAAM,EAAE,gBAAgB,EAAE,YAAY,EAAE,YAAY,EAAE,GAAG,KAAK,CAAC;IAE/D,IAAI,CAAC,SAAS,CAAC,gBAAgB,CAAC,EAAE,CAAC;QACjC,IAAI,gBAAgB,GAAG,CAAC,IAAI,gBAAgB,GAAG,CAAC;YAC9C,MAAM,IAAI,KAAK,CAAC,uDAAuD,gBAAgB,EAAE,CAAC,CAAC;IAC/F,CAAC;IAED,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,EAAE,CAAC;QAC7B,IAAI,YAAY,GAAG,CAAC,IAAI,YAAY,GAAG,CAAC;YACtC,MAAM,IAAI,KAAK,CAAC,mDAAmD,YAAY,EAAE,CAAC,CAAC;IACvF,CAAC;IAED,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,EAAE,CAAC;QAC7B,IAAI,YAAY,GAAG,CAAC,IAAI,YAAY,GAAG,CAAC;YACtC,MAAM,IAAI,KAAK,CAAC,mDAAmD,YAAY,EAAE,CAAC,CAAC;IACvF,CAAC;IAED,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,YAAY,IAAI,YAAY;QACtF,MAAM,IAAI,KAAK,CACb,0DAA0D,IAAI,CAAC,SAAS,CAAC,EAAE,YAAY,EAAE,YAAY,EAAE,CAAC,EAAE,CAC3G,CAAC;IAEJ,IAAI,CAAC,SAAS,CAAC,gBAAgB,CAAC,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,gBAAgB,GAAG,YAAY;QAC7F,MAAM,IAAI,KAAK,CACb,uDAAuD,IAAI,CAAC,SAAS,CAAC,EAAE,gBAAgB,EAAE,YAAY,EAAE,CAAC,EAAE,CAC5G,CAAC;IAEJ,IAAI,CAAC,SAAS,CAAC,gBAAgB,CAAC,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,gBAAgB,GAAG,YAAY;QAC7F,MAAM,IAAI,KAAK,CACb,uDAAuD,IAAI,CAAC,SAAS,CAAC,EAAE,gBAAgB,EAAE,YAAY,EAAE,CAAC,EAAE,CAC5G,CAAC;AACN,CAAC,CAAC"}

package/dist/components/layout/resizable/index.d.ts

@@ -1,3 +1,5 @@
+export * from './horizontal-resizable-split-view';
+export * from './horizontal-resizable-split-view.types';
 export * from './resizable-overlay-view';
 export * from './vertical-resizable-overlay-view.types';
 export * from './vertical-resizable-split-view';

package/dist/components/layout/resizable/index.js

@@ -1,3 +1,5 @@
+export * from './horizontal-resizable-split-view';
+export * from './horizontal-resizable-split-view.types';
 export * from './resizable-overlay-view';
 export * from './vertical-resizable-overlay-view.types';
 export * from './vertical-resizable-split-view';

package/dist/components/layout/resizable/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/layout/resizable/index.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAC;AACzC,cAAc,yCAAyC,CAAC;AACxD,cAAc,iCAAiC,CAAC;AAChD,cAAc,uCAAuC,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/layout/resizable/index.ts"],"names":[],"mappings":"AAAA,cAAc,mCAAmC,CAAC;AAClD,cAAc,yCAAyC,CAAC;AACxD,cAAc,0BAA0B,CAAC;AACzC,cAAc,yCAAyC,CAAC;AACxD,cAAc,iCAAiC,CAAC;AAChD,cAAc,uCAAuC,CAAC"}

package/dist/components/layout/resizable/vertical-resizable-overlay-view.types.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { ViewStyle } from 'react-native';
+import { StyleProp, ViewStyle } from 'react-native';
 export type VerticalResizableOverlayViewAnchorType = 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight';
 export interface VerticalResizableOverlayViewProps {
     /** Content to display in the overlay section (foreground, on top) */
@@ -20,9 +20,9 @@ export interface VerticalResizableOverlayViewProps {
     /** Aspect ratio (width/height) for the foreground content. If provided, width will be calculated based on height */
     foregroundContentAspectRatio?: number;
     /** Style for the drag handle container */
-    handleContainerStyle?: ViewStyle;
+    handleContainerStyle?: StyleProp<ViewStyle>;
     /** Style for the drag handle bar */
-    handleStyle?: ViewStyle;
+    handleStyle?: StyleProp<ViewStyle>;
     /** Whether to hide the drag handle. Default: false */
     hideHandle?: boolean;
 }

package/dist/components/layout/resizable/vertical-resizable-split-view.types.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { ViewStyle } from 'react-native';
+import { StyleProp, ViewStyle } from 'react-native';
 export interface VerticalResizableSplitViewProps {
     /** Content to display in the top section */
     topContent: ReactNode;
@@ -12,9 +12,9 @@ export interface VerticalResizableSplitViewProps {
     /** Maximum proportion for the top section (0 to 1). Default: 0.85 */
     maxTopRatio?: number;
     /** Style for the drag handle container */
-    handleContainerStyle?: ViewStyle;
+    handleContainerStyle?: StyleProp<ViewStyle>;
     /** Style for the drag handle bar */
-    handleStyle?: ViewStyle;
+    handleStyle?: StyleProp<ViewStyle>;
     /** Whether to hide the drag handle. Default: false */
     hideHandle?: boolean;
 }

package/dist/hooks/index.d.ts

@@ -6,3 +6,4 @@ export * from './use-single-file-selector';
 export * from './use-timeout-state';
 export * from './use-timeout-toggle';
 export * from './use-updates';
+export * from './use-window-orientation';

package/dist/hooks/index.js

@@ -6,4 +6,5 @@ export * from './use-single-file-selector';
 export * from './use-timeout-state';
 export * from './use-timeout-toggle';
 export * from './use-updates';
+export * from './use-window-orientation';
 //# sourceMappingURL=index.js.map

package/dist/hooks/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC;AACtC,cAAc,oBAAoB,CAAC;AACnC,cAAc,mCAAmC,CAAC;AAClD,cAAc,uBAAuB,CAAC;AACtC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,qBAAqB,CAAC;AACpC,cAAc,sBAAsB,CAAC;AACrC,cAAc,eAAe,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC;AACtC,cAAc,oBAAoB,CAAC;AACnC,cAAc,mCAAmC,CAAC;AAClD,cAAc,uBAAuB,CAAC;AACtC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,qBAAqB,CAAC;AACpC,cAAc,sBAAsB,CAAC;AACrC,cAAc,eAAe,CAAC;AAC9B,cAAc,0BAA0B,CAAC"}

package/dist/hooks/use-window-orientation.d.ts

@@ -0,0 +1,3 @@
+export type WindowOrientation = 'portrait' | 'landscape';
+export declare const useWindowOrientation: () => WindowOrientation;
+export declare const useIsLandscape: () => boolean;

package/dist/hooks/use-window-orientation.js

@@ -0,0 +1,10 @@
+import { useWindowDimensions } from 'react-native';
+export const useWindowOrientation = () => {
+    const { width, height } = useWindowDimensions();
+    return width > height ? 'landscape' : 'portrait';
+};
+export const useIsLandscape = () => {
+    const orientation = useWindowOrientation();
+    return orientation === 'landscape';
+};
+//# sourceMappingURL=use-window-orientation.js.map

package/dist/hooks/use-window-orientation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-window-orientation.js","sourceRoot":"","sources":["../../src/hooks/use-window-orientation.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAInD,MAAM,CAAC,MAAM,oBAAoB,GAAG,GAAsB,EAAE;IAC1D,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,mBAAmB,EAAE,CAAC;IAChD,OAAO,KAAK,GAAG,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,UAAU,CAAC;AACnD,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,GAAY,EAAE;IAC1C,MAAM,WAAW,GAAG,oBAAoB,EAAE,CAAC;IAC3C,OAAO,WAAW,KAAK,WAAW,CAAC;AACrC,CAAC,CAAC"}

package/package.json

@@ -3,7 +3,7 @@
   "description": "Lichens Innovation React Native Expo shared components, utilities, hooks and services",
   "repository": "https://github.com/Lichens-Innovation/react-native-common",
   "author": "Lichens Innovation",
-  "version": "3.2.0",
+  "version": "3.3.1",
   "private": false,
   "main": "dist/index.js",
   "types": "dist/index.d.ts",