rn-feav-ui 1.0.4 → 1.0.6

package/dist/components/InputOTP/index.js

@@ -0,0 +1,79 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InputOTPFEA = void 0;
+var React = __importStar(require("react"));
+var react_native_1 = require("react-native");
+var ThemeFEAVUiProvider_1 = require("../../theme/ThemeFEAVUiProvider");
+var InputOTPFEA = function (_a) {
+    var value = _a.value, onChange = _a.onChange, _b = _a.length, length = _b === void 0 ? 6 : _b, style = _a.style;
+    var theme = (0, ThemeFEAVUiProvider_1.useTheme)().theme;
+    var refs = React.useRef([]);
+    var chars = Array.from({ length: length }, function (_, i) { var _a; return (_a = value[i]) !== null && _a !== void 0 ? _a : ""; });
+    return (React.createElement(react_native_1.View, { style: [styles.row, style] }, chars.map(function (ch, idx) { return (React.createElement(react_native_1.TextInput, { key: idx, ref: function (r) {
+            refs.current[idx] = r;
+        }, value: ch, keyboardType: "number-pad", maxLength: 1, placeholder: "\u2022", placeholderTextColor: theme.colors.mutedForeground, style: [
+            styles.cell,
+            {
+                borderColor: theme.colors.input,
+                color: theme.colors.foreground,
+                backgroundColor: theme.colors.background,
+            },
+        ], onChangeText: function (t) {
+            var _a;
+            var nextChar = t.replace(/\D/g, "").slice(-1);
+            var next = value.split("");
+            while (next.length < length)
+                next.push("");
+            next[idx] = nextChar;
+            var joined = next.join("").slice(0, length);
+            onChange(joined);
+            if (nextChar && idx < length - 1)
+                (_a = refs.current[idx + 1]) === null || _a === void 0 ? void 0 : _a.focus();
+        } })); })));
+};
+exports.InputOTPFEA = InputOTPFEA;
+var styles = react_native_1.StyleSheet.create({
+    row: { flexDirection: "row", gap: 8 },
+    cell: {
+        width: 44,
+        height: 48,
+        borderWidth: 1,
+        borderRadius: 10,
+        textAlign: "center",
+        fontSize: 18,
+        fontWeight: "600",
+    },
+});

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

@@ -0,0 +1,6 @@
+import * as React from "react";
+import { StyleProp, TextStyle } from "react-native";
+export declare const KbdFEA: ({ children, style, }: {
+    children: React.ReactNode;
+    style?: StyleProp<TextStyle>;
+}) => React.JSX.Element;

package/dist/components/Kbd/index.js

@@ -0,0 +1,62 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.KbdFEA = void 0;
+var React = __importStar(require("react"));
+var react_native_1 = require("react-native");
+var ThemeFEAVUiProvider_1 = require("../../theme/ThemeFEAVUiProvider");
+var KbdFEA = function (_a) {
+    var children = _a.children, style = _a.style;
+    var theme = (0, ThemeFEAVUiProvider_1.useTheme)().theme;
+    return (React.createElement(react_native_1.View, { style: [
+            styles.wrap,
+            { backgroundColor: theme.colors.muted, borderColor: theme.colors.border },
+        ] },
+        React.createElement(react_native_1.Text, { style: [styles.text, { color: theme.colors.foreground }, style] }, children)));
+};
+exports.KbdFEA = KbdFEA;
+var styles = react_native_1.StyleSheet.create({
+    wrap: {
+        borderWidth: 1,
+        borderRadius: 8,
+        paddingHorizontal: 8,
+        paddingVertical: 4,
+        alignSelf: "flex-start",
+    },
+    text: {
+        fontSize: 12,
+        fontWeight: "600",
+    },
+});

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

@@ -1,6 +1,13 @@
 import * as React from "react";
 import { StyleProp, TextStyle } from "react-native";
-export declare const LabelFEA: ({ children, style, }: {
+export declare const LabelFEA: ({ children, style, required, disabled, testID, nativeID, numberOfLines, }: {
     children: React.ReactNode;
     style?: StyleProp<TextStyle>;
+    /** Shows a trailing asterisk when true. */
+    required?: boolean;
+    disabled?: boolean;
+    testID?: string;
+    /** Wire to an input via `nativeID` / `accessibilityLabelledBy` patterns. */
+    nativeID?: string;
+    numberOfLines?: number;
 }) => React.JSX.Element;

package/dist/components/Label/index.js

@@ -38,9 +38,15 @@ var React = __importStar(require("react"));
 var react_native_1 = require("react-native");
 var ThemeFEAVUiProvider_1 = require("../../theme/ThemeFEAVUiProvider");
 var LabelFEA = function (_a) {
-    var children = _a.children, style = _a.style;
+    var children = _a.children, style = _a.style, required = _a.required, disabled = _a.disabled, testID = _a.testID, nativeID = _a.nativeID, numberOfLines = _a.numberOfLines;
     var theme = (0, ThemeFEAVUiProvider_1.useTheme)().theme;
-    return React.createElement(react_native_1.Text, { style: [styles.base, { color: theme.colors.text }, style] }, children);
+    return (React.createElement(react_native_1.Text, { nativeID: nativeID, testID: testID, numberOfLines: numberOfLines, style: [
+            styles.base,
+            { color: theme.colors.foreground, opacity: disabled ? 0.6 : 1 },
+            style,
+        ] },
+        children,
+        required ? React.createElement(react_native_1.Text, { style: { color: theme.colors.destructive } }, " *") : null));
 };
 exports.LabelFEA = LabelFEA;
 var styles = react_native_1.StyleSheet.create({

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

@@ -0,0 +1,11 @@
+import * as React from "react";
+import { StyleProp, ViewStyle } from "react-native";
+import { DropdownMenuItemFEA } from "../DropdownMenu";
+export type MenubarItemFEA = {
+    label: string;
+    items: DropdownMenuItemFEA[];
+};
+export declare const MenubarFEA: ({ items, style, }: {
+    items: MenubarItemFEA[];
+    style?: StyleProp<ViewStyle>;
+}) => React.JSX.Element;

package/dist/components/Menubar/index.js

@@ -0,0 +1,69 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MenubarFEA = void 0;
+var React = __importStar(require("react"));
+var react_native_1 = require("react-native");
+var ThemeFEAVUiProvider_1 = require("../../theme/ThemeFEAVUiProvider");
+var DropdownMenu_1 = require("../DropdownMenu");
+var MenubarFEA = function (_a) {
+    var items = _a.items, style = _a.style;
+    var theme = (0, ThemeFEAVUiProvider_1.useTheme)().theme;
+    var _b = React.useState(null), openKey = _b[0], setOpenKey = _b[1];
+    return (React.createElement(react_native_1.ScrollView, { horizontal: true, showsHorizontalScrollIndicator: false, contentContainerStyle: [
+            styles.row,
+            { backgroundColor: theme.colors.muted, borderColor: theme.colors.border },
+            style,
+        ] }, items.map(function (it) {
+        var open = openKey === it.label;
+        return (React.createElement(DropdownMenu_1.DropdownMenuFEA, { key: it.label, open: open, onOpenChange: function (next) { return setOpenKey(next ? it.label : null); }, items: it.items, trigger: React.createElement(react_native_1.Pressable, { style: styles.trigger },
+                React.createElement(react_native_1.Text, { style: { color: theme.colors.foreground, fontWeight: "600" } }, it.label)), style: { minWidth: 240 } }));
+    })));
+};
+exports.MenubarFEA = MenubarFEA;
+var styles = react_native_1.StyleSheet.create({
+    row: {
+        padding: 6,
+        gap: 6,
+        borderWidth: 1,
+        borderRadius: 12,
+        alignItems: "center",
+    },
+    trigger: {
+        paddingVertical: 8,
+        paddingHorizontal: 10,
+        borderRadius: 10,
+    },
+});

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

@@ -0,0 +1,21 @@
+import * as React from "react";
+import { StyleProp, ViewStyle } from "react-native";
+export type SelectOptionFEA = {
+    label: string;
+    value: string;
+    disabled?: boolean;
+};
+export declare const NativeSelectFEA: ({ value, onValueChange, options, placeholder, style, }: {
+    value?: string;
+    onValueChange: (next: string) => void;
+    options: SelectOptionFEA[];
+    placeholder?: string;
+    style?: StyleProp<ViewStyle>;
+}) => React.JSX.Element;
+export declare const SelectFEA: ({ value, onValueChange, options, placeholder, style, }: {
+    value?: string;
+    onValueChange: (next: string) => void;
+    options: SelectOptionFEA[];
+    placeholder?: string;
+    style?: StyleProp<ViewStyle>;
+}) => React.JSX.Element;

package/dist/components/NativeSelect/index.js

@@ -0,0 +1,76 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SelectFEA = exports.NativeSelectFEA = void 0;
+var React = __importStar(require("react"));
+var react_native_1 = require("react-native");
+var ThemeFEAVUiProvider_1 = require("../../theme/ThemeFEAVUiProvider");
+var DropdownMenu_1 = require("../DropdownMenu");
+var NativeSelectFEA = function (_a) {
+    var _b;
+    var value = _a.value, onValueChange = _a.onValueChange, options = _a.options, _c = _a.placeholder, placeholder = _c === void 0 ? "Select..." : _c, style = _a.style;
+    var theme = (0, ThemeFEAVUiProvider_1.useTheme)().theme;
+    var _d = React.useState(false), open = _d[0], setOpen = _d[1];
+    var selected = options.find(function (o) { return o.value === value; });
+    var items = options.map(function (o) { return ({
+        label: o.label,
+        disabled: o.disabled,
+        onSelect: function () { return onValueChange(o.value); },
+    }); });
+    return (React.createElement(DropdownMenu_1.DropdownMenuFEA, { open: open, onOpenChange: setOpen, items: items, style: style, trigger: React.createElement(react_native_1.Pressable, { style: [
+                styles.trigger,
+                {
+                    borderColor: theme.colors.input,
+                    backgroundColor: theme.colors.background,
+                },
+            ] },
+            React.createElement(react_native_1.Text, { style: { color: selected ? theme.colors.foreground : theme.colors.mutedForeground, fontWeight: "500" } }, (_b = selected === null || selected === void 0 ? void 0 : selected.label) !== null && _b !== void 0 ? _b : placeholder),
+            React.createElement(react_native_1.View, { style: styles.chev },
+                React.createElement(react_native_1.Text, { style: { color: theme.colors.mutedForeground } }, "\u25BE"))) }));
+};
+exports.NativeSelectFEA = NativeSelectFEA;
+exports.SelectFEA = exports.NativeSelectFEA;
+var styles = react_native_1.StyleSheet.create({
+    trigger: {
+        borderWidth: 1,
+        borderRadius: 10,
+        paddingVertical: 10,
+        paddingHorizontal: 12,
+        flexDirection: "row",
+        alignItems: "center",
+        justifyContent: "space-between",
+    },
+    chev: { marginLeft: 10 },
+});

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

@@ -0,0 +1,13 @@
+import * as React from "react";
+import { StyleProp, ViewStyle } from "react-native";
+export type NavigationMenuItemFEA = {
+    label: string;
+    value: string;
+    disabled?: boolean;
+};
+export declare const NavigationMenuFEA: ({ value, onValueChange, items, style, }: {
+    value: string;
+    onValueChange: (next: string) => void;
+    items: NavigationMenuItemFEA[];
+    style?: StyleProp<ViewStyle>;
+}) => React.JSX.Element;

package/dist/components/NavigationMenu/index.js

@@ -0,0 +1,81 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NavigationMenuFEA = void 0;
+var React = __importStar(require("react"));
+var react_native_1 = require("react-native");
+var ThemeFEAVUiProvider_1 = require("../../theme/ThemeFEAVUiProvider");
+var Separator_1 = require("../Separator");
+var NavigationMenuFEA = function (_a) {
+    var value = _a.value, onValueChange = _a.onValueChange, items = _a.items, style = _a.style;
+    var theme = (0, ThemeFEAVUiProvider_1.useTheme)().theme;
+    return (React.createElement(react_native_1.View, { style: [
+            styles.wrap,
+            { backgroundColor: theme.colors.muted, borderColor: theme.colors.border },
+            style,
+        ] },
+        React.createElement(react_native_1.ScrollView, { horizontal: true, showsHorizontalScrollIndicator: false, contentContainerStyle: styles.row }, items.map(function (it, idx) {
+            var active = it.value === value;
+            return (React.createElement(React.Fragment, { key: it.value },
+                React.createElement(react_native_1.Pressable, { disabled: it.disabled, onPress: function () { return onValueChange(it.value); }, style: function (_a) {
+                        var pressed = _a.pressed;
+                        return [
+                            styles.item,
+                            {
+                                backgroundColor: active
+                                    ? theme.colors.background
+                                    : pressed
+                                        ? theme.colors.muted
+                                        : "transparent",
+                                borderColor: active ? theme.colors.border : "transparent",
+                                opacity: it.disabled ? 0.5 : 1,
+                            },
+                        ];
+                    } },
+                    React.createElement(react_native_1.Text, { style: { color: theme.colors.foreground, fontWeight: active ? "700" : "600" } }, it.label)),
+                idx < items.length - 1 ? React.createElement(Separator_1.SeparatorFEA, { style: { width: 1, height: 18, opacity: 0.5 } }) : null));
+        }))));
+};
+exports.NavigationMenuFEA = NavigationMenuFEA;
+var styles = react_native_1.StyleSheet.create({
+    wrap: { borderWidth: 1, borderRadius: 12, padding: 4 },
+    row: { alignItems: "center", gap: 6 },
+    item: {
+        borderWidth: 1,
+        borderRadius: 10,
+        paddingVertical: 8,
+        paddingHorizontal: 10,
+    },
+});

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

@@ -0,0 +1,9 @@
+import * as React from "react";
+import { StyleProp, ViewStyle } from "react-native";
+export declare const PaginationFEA: ({ page, pageCount, onPageChange, style, siblingCount, }: {
+    page: number;
+    pageCount: number;
+    onPageChange: (next: number) => void;
+    style?: StyleProp<ViewStyle>;
+    siblingCount?: number;
+}) => React.JSX.Element;

package/dist/components/Pagination/index.js

@@ -0,0 +1,101 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PaginationFEA = void 0;
+var React = __importStar(require("react"));
+var react_native_1 = require("react-native");
+var ThemeFEAVUiProvider_1 = require("../../theme/ThemeFEAVUiProvider");
+var PageButton = function (_a) {
+    var label = _a.label, active = _a.active, disabled = _a.disabled, onPress = _a.onPress, _b = _a.variant, variant = _b === void 0 ? "default" : _b;
+    var theme = (0, ThemeFEAVUiProvider_1.useTheme)().theme;
+    var bg = variant === "ghost"
+        ? "transparent"
+        : active
+            ? theme.colors.primary
+            : theme.colors.background;
+    var borderColor = variant === "ghost" ? "transparent" : theme.colors.border;
+    var color = active ? theme.colors.primaryForeground : theme.colors.foreground;
+    return (React.createElement(react_native_1.Pressable, { disabled: disabled, onPress: onPress, style: function (_a) {
+            var pressed = _a.pressed;
+            return [
+                styles.btn,
+                {
+                    backgroundColor: pressed && !active ? theme.colors.muted : bg,
+                    borderColor: borderColor,
+                    opacity: disabled ? 0.5 : 1,
+                },
+            ];
+        } },
+        React.createElement(react_native_1.Text, { style: { color: color, fontWeight: "600" } }, label)));
+};
+var PaginationFEA = function (_a) {
+    var page = _a.page, pageCount = _a.pageCount, onPageChange = _a.onPageChange, style = _a.style, _b = _a.siblingCount, siblingCount = _b === void 0 ? 1 : _b;
+    var safeCount = Math.max(1, pageCount);
+    var safePage = Math.max(1, Math.min(safeCount, page));
+    var pages = [];
+    var start = Math.max(1, safePage - siblingCount);
+    var end = Math.min(safeCount, safePage + siblingCount);
+    if (start > 1)
+        pages.push(1);
+    if (start > 2)
+        pages.push("…");
+    for (var p = start; p <= end; p++)
+        pages.push(p);
+    if (end < safeCount - 1)
+        pages.push("…");
+    if (end < safeCount)
+        pages.push(safeCount);
+    return (React.createElement(react_native_1.View, { style: [styles.row, style] },
+        React.createElement(PageButton, { label: "Prev", disabled: safePage === 1, onPress: function () { return onPageChange(safePage - 1); }, variant: "ghost" }),
+        pages.map(function (p, idx) {
+            return p === "…" ? (React.createElement(react_native_1.View, { key: "dots-".concat(idx), style: styles.dots },
+                React.createElement(react_native_1.Text, { style: { opacity: 0.6 } }, "\u2026"))) : (React.createElement(PageButton, { key: "p-".concat(p), label: "".concat(p), active: p === safePage, onPress: function () { return onPageChange(p); } }));
+        }),
+        React.createElement(PageButton, { label: "Next", disabled: safePage === safeCount, onPress: function () { return onPageChange(safePage + 1); }, variant: "ghost" })));
+};
+exports.PaginationFEA = PaginationFEA;
+var styles = react_native_1.StyleSheet.create({
+    row: { flexDirection: "row", alignItems: "center", gap: 8, flexWrap: "wrap" },
+    btn: {
+        minWidth: 38,
+        height: 38,
+        paddingHorizontal: 12,
+        borderRadius: 10,
+        borderWidth: 1,
+        alignItems: "center",
+        justifyContent: "center",
+    },
+    dots: { width: 24, alignItems: "center" },
+});

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

@@ -0,0 +1,9 @@
+import * as React from "react";
+import { StyleProp, ViewStyle } from "react-native";
+export declare const PopoverFEA: ({ open, onOpenChange, trigger, children, contentStyle, }: {
+    open: boolean;
+    onOpenChange: (next: boolean) => void;
+    trigger: React.ReactNode;
+    children: React.ReactNode;
+    contentStyle?: StyleProp<ViewStyle>;
+}) => React.JSX.Element;

package/dist/components/Popover/index.js

@@ -0,0 +1,69 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PopoverFEA = void 0;
+var React = __importStar(require("react"));
+var react_native_1 = require("react-native");
+var ThemeFEAVUiProvider_1 = require("../../theme/ThemeFEAVUiProvider");
+var Card_1 = require("../Card");
+var PopoverFEA = function (_a) {
+    var open = _a.open, onOpenChange = _a.onOpenChange, trigger = _a.trigger, children = _a.children, contentStyle = _a.contentStyle;
+    var theme = (0, ThemeFEAVUiProvider_1.useTheme)().theme;
+    return (React.createElement(React.Fragment, null,
+        React.createElement(react_native_1.Pressable, { onPress: function () { return onOpenChange(!open); } }, trigger),
+        React.createElement(react_native_1.Modal, { transparent: true, visible: open, animationType: "fade", onRequestClose: function () { return onOpenChange(false); } },
+            React.createElement(react_native_1.Pressable, { style: [
+                    styles.overlay,
+                    { backgroundColor: theme.mode === "light" ? "rgba(0,0,0,0.25)" : "rgba(0,0,0,0.55)" },
+                ], onPress: function () { return onOpenChange(false); } },
+                React.createElement(react_native_1.Pressable, { onPress: function () { return null; }, style: styles.innerPress },
+                    React.createElement(Card_1.CardFEA, { style: [styles.card, contentStyle] }, children))))));
+};
+exports.PopoverFEA = PopoverFEA;
+var styles = react_native_1.StyleSheet.create({
+    overlay: {
+        flex: 1,
+        alignItems: "center",
+        justifyContent: "center",
+        padding: 20,
+    },
+    innerPress: {
+        width: "100%",
+        maxWidth: 420,
+    },
+    card: {
+        width: "100%",
+    },
+});

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

@@ -0,0 +1,13 @@
+import * as React from "react";
+import { StyleProp, ViewStyle } from "react-native";
+export type RadioOptionFEA = {
+    label: string;
+    value: string;
+    disabled?: boolean;
+};
+export declare const RadioGroupFEA: ({ value, onValueChange, options, style, }: {
+    value: string;
+    onValueChange: (next: string) => void;
+    options: RadioOptionFEA[];
+    style?: StyleProp<ViewStyle>;
+}) => React.JSX.Element;