@gaozh1024/rn-kit 0.3.0 → 0.3.2

package/dist/index.mjs

@@ -1243,7 +1243,7 @@ var styles = StyleSheet2.create({
     flex: 1
   }
 });
-function Page({
+function AppScreen({
   children,
   className,
   ...props
@@ -1569,7 +1569,8 @@ function Card({
 }
 
 // src/ui/display/Icon.tsx
-import MaterialIcons from "react-native-vector-icons/MaterialIcons";
+import { Text as Text2 } from "react-native";
+import { MaterialIcons } from "@expo/vector-icons";
 import { jsx as jsx16 } from "nativewind/jsx-runtime";
 var sizeMap2 = {
   xs: 16,
@@ -1578,6 +1579,12 @@ var sizeMap2 = {
   lg: 32,
   xl: 48
 };
+function isComponentLike(value) {
+  if (typeof value === "function") return true;
+  if (typeof value !== "object" || value === null) return false;
+  return "$$typeof" in value;
+}
+var MaterialIconComponent = isComponentLike(MaterialIcons) ? MaterialIcons : void 0;
 function resolveSize(size = "md") {
   if (typeof size === "number") return size;
   return sizeMap2[size] || 24;
@@ -1586,11 +1593,37 @@ function Icon({ name, size = "md", color = "gray-600", style, onPress, testID })
   const { theme, isDark } = useOptionalTheme();
   const resolvedSize = resolveSize(size);
   const resolvedColor = resolveNamedColor(color, theme, isDark) ?? color;
+  const fallback = /* @__PURE__ */ jsx16(
+    Text2,
+    {
+      style: [
+        {
+          color: resolvedColor,
+          fontSize: resolvedSize,
+          lineHeight: resolvedSize
+        },
+        style
+      ],
+      testID,
+      children: "\u25A1"
+    }
+  );
+  if (!MaterialIconComponent) {
+    return onPress ? /* @__PURE__ */ jsx16(AppPressable, { onPress, children: fallback }) : fallback;
+  }
   if (onPress) {
-    return /* @__PURE__ */ jsx16(AppPressable, { onPress, testID, children: /* @__PURE__ */ jsx16(MaterialIcons, { name, size: resolvedSize, color: resolvedColor, style }) });
+    return /* @__PURE__ */ jsx16(AppPressable, { onPress, testID, children: /* @__PURE__ */ jsx16(
+      MaterialIconComponent,
+      {
+        name,
+        size: resolvedSize,
+        color: resolvedColor,
+        style
+      }
+    ) });
   }
   return /* @__PURE__ */ jsx16(
-    MaterialIcons,
+    MaterialIconComponent,
     {
       name,
       size: resolvedSize,
@@ -1840,12 +1873,18 @@ function EmptyState({
     description && /* @__PURE__ */ jsx18(AppText, { size: "sm", className: "mt-2", style: { color: colors.textMuted }, children: description })
   ] });
 }
-function ErrorState({ error, onRetry }) {
+function ErrorState({
+  error,
+  onRetry,
+  errorTitle,
+  errorDescription,
+  retryText
+}) {
   const colors = useThemeColors();
   return /* @__PURE__ */ jsxs4(Center, { py: 20, children: [
     /* @__PURE__ */ jsx18(Icon, { name: "error-outline", size: 64, color: "error-300" }),
-    /* @__PURE__ */ jsx18(AppText, { size: "lg", weight: "medium", color: "error-500", className: "mt-4", children: "\u52A0\u8F7D\u5931\u8D25" }),
-    /* @__PURE__ */ jsx18(AppText, { size: "sm", style: { color: colors.textMuted }, className: "mt-2 text-center px-8", children: error.message || "\u8BF7\u68C0\u67E5\u7F51\u7EDC\u540E\u91CD\u8BD5" }),
+    /* @__PURE__ */ jsx18(AppText, { size: "lg", weight: "medium", color: "error-500", className: "mt-4", children: errorTitle || "\u52A0\u8F7D\u5931\u8D25" }),
+    /* @__PURE__ */ jsx18(AppText, { size: "sm", style: { color: colors.textMuted }, className: "mt-2 text-center px-8", children: error.message || errorDescription || "\u8BF7\u68C0\u67E5\u7F51\u7EDC\u540E\u91CD\u8BD5" }),
     onRetry && /* @__PURE__ */ jsx18(
       AppPressable,
       {
@@ -1855,7 +1894,7 @@ function ErrorState({ error, onRetry }) {
           styles3.retryButton,
           { backgroundColor: colors.cardElevated, borderColor: colors.border }
         ],
-        children: /* @__PURE__ */ jsx18(AppText, { style: { color: colors.textSecondary }, className: "text-center", children: "\u91CD\u65B0\u52A0\u8F7D" })
+        children: /* @__PURE__ */ jsx18(AppText, { style: { color: colors.textSecondary }, className: "text-center", children: retryText || "\u91CD\u65B0\u52A0\u8F7D" })
       }
     )
   ] });
@@ -1886,6 +1925,9 @@ function AppList({
   onEndReachedThreshold = 0.5,
   error,
   onRetry,
+  errorTitle,
+  errorDescription,
+  retryText,
   emptyTitle,
   emptyDescription,
   emptyIcon,
@@ -1954,7 +1996,16 @@ function AppList({
     );
   }
   if (error && data.length === 0) {
-    return /* @__PURE__ */ jsx18(Center, { style, children: /* @__PURE__ */ jsx18(ErrorState, { error, onRetry }) });
+    return /* @__PURE__ */ jsx18(Center, { style, children: /* @__PURE__ */ jsx18(
+      ErrorState,
+      {
+        error,
+        onRetry,
+        errorTitle,
+        errorDescription,
+        retryText
+      }
+    ) });
   }
   const ListEmptyComponent = useMemo3(() => {
     if (EmptyComponent) return /* @__PURE__ */ jsx18(EmptyComponent, {});
@@ -2116,14 +2167,7 @@ function PageDrawer({
           }
         ),
         /* @__PURE__ */ jsx19(AppScrollView, { flex: true, className: "px-4 py-4", children }),
-        footer && /* @__PURE__ */ jsx19(
-          AppView,
-          {
-            className: "px-4 py-4",
-            style: [styles4.footer, { borderTopColor: colors.divider }],
-            children: footer
-          }
-        )
+        footer && /* @__PURE__ */ jsx19(AppView, { className: "px-4 py-4", style: [styles4.footer, { borderTopColor: colors.divider }], children: footer })
       ]
     }
   );
@@ -2785,6 +2829,9 @@ import {
   StyleSheet as StyleSheet11
 } from "react-native";
 import { Fragment as Fragment2, jsx as jsx28, jsxs as jsxs10 } from "nativewind/jsx-runtime";
+function formatSelectedCountText(template, count) {
+  return template.replace("{{count}}", String(count));
+}
 function Select({
   value,
   onChange,
@@ -2795,6 +2842,12 @@ function Select({
   onSearch,
   disabled = false,
   clearable = true,
+  singleSelectTitle = "\u8BF7\u9009\u62E9",
+  multipleSelectTitle = "\u9009\u62E9\u9009\u9879",
+  searchPlaceholder = "\u641C\u7D22...",
+  emptyText = "\u6682\u65E0\u9009\u9879",
+  selectedCountText = "\u5DF2\u9009\u62E9 {{count}} \u9879",
+  confirmText = "\u786E\u5B9A",
   className
 }) {
   const colors = useFormThemeColors();
@@ -2918,7 +2971,7 @@ function Select({
                   className: "px-4 py-3",
                   style: [styles10.header, { borderBottomColor: colors.divider }],
                   children: [
-                    /* @__PURE__ */ jsx28(AppText, { className: "text-lg font-semibold", style: { color: colors.text }, children: multiple ? "\u9009\u62E9\u9009\u9879" : "\u8BF7\u9009\u62E9" }),
+                    /* @__PURE__ */ jsx28(AppText, { className: "text-lg font-semibold", style: { color: colors.text }, children: multiple ? multipleSelectTitle : singleSelectTitle }),
                     /* @__PURE__ */ jsx28(TouchableOpacity5, { onPress: () => setVisible(false), children: /* @__PURE__ */ jsx28(Icon, { name: "close", size: "md", color: colors.icon }) })
                   ]
                 }
@@ -2942,7 +2995,7 @@ function Select({
                           {
                             className: "flex-1 text-base",
                             style: { color: colors.text },
-                            placeholder: "\u641C\u7D22...",
+                            placeholder: searchPlaceholder,
                             placeholderTextColor: colors.textMuted,
                             value: searchKeyword,
                             onChangeText: handleSearch,
@@ -2961,7 +3014,7 @@ function Select({
                   data: filteredOptions,
                   keyExtractor: (item) => item.value,
                   renderItem: renderOption,
-                  ListEmptyComponent: /* @__PURE__ */ jsx28(AppView, { center: true, className: "py-8", children: /* @__PURE__ */ jsx28(AppText, { style: { color: colors.textMuted }, children: "\u6682\u65E0\u9009\u9879" }) })
+                  ListEmptyComponent: /* @__PURE__ */ jsx28(AppView, { center: true, className: "py-8", children: /* @__PURE__ */ jsx28(AppText, { style: { color: colors.textMuted }, children: emptyText }) })
                 }
               ),
               multiple && /* @__PURE__ */ jsxs10(
@@ -2973,18 +3026,14 @@ function Select({
                   className: "px-4 py-3",
                   style: [styles10.footer, { borderTopColor: colors.divider }],
                   children: [
-                    /* @__PURE__ */ jsxs10(AppText, { style: { color: colors.textMuted }, children: [
-                      "\u5DF2\u9009\u62E9 ",
-                      selectedValues.length,
-                      " \u9879"
-                    ] }),
+                    /* @__PURE__ */ jsx28(AppText, { style: { color: colors.textMuted }, children: formatSelectedCountText(selectedCountText, selectedValues.length) }),
                     /* @__PURE__ */ jsx28(
                       TouchableOpacity5,
                       {
                         className: "px-4 py-2 rounded-lg",
                         style: { backgroundColor: colors.primary },
                         onPress: () => setVisible(false),
-                        children: /* @__PURE__ */ jsx28(AppText, { className: "font-medium", style: { color: colors.textInverse }, children: "\u786E\u5B9A" })
+                        children: /* @__PURE__ */ jsx28(AppText, { className: "font-medium", style: { color: colors.textInverse }, children: confirmText })
                       }
                     )
                   ]
@@ -3075,7 +3124,17 @@ function DatePicker({
   format = "yyyy-MM-dd",
   minDate,
   maxDate,
-  className
+  className,
+  cancelText = "\u53D6\u6D88",
+  confirmText = "\u786E\u5B9A",
+  pickerTitle = "\u9009\u62E9\u65E5\u671F",
+  pickerDateFormat = "yyyy\u5E74MM\u6708dd\u65E5",
+  yearLabel = "\u5E74",
+  monthLabel = "\u6708",
+  dayLabel = "\u65E5",
+  todayText = "\u4ECA\u5929",
+  minDateText = "\u6700\u65E9",
+  maxDateText = "\u6700\u665A"
 }) {
   const colors = useFormThemeColors();
   const [visible, setVisible] = useState18(false);
@@ -3169,18 +3228,18 @@ function DatePicker({
               className: "px-4 py-3",
               style: [styles11.header, { borderBottomColor: colors.divider }],
               children: [
-                /* @__PURE__ */ jsx29(TouchableOpacity6, { onPress: () => setVisible(false), children: /* @__PURE__ */ jsx29(AppText, { style: { color: colors.textMuted }, children: "\u53D6\u6D88" }) }),
-                /* @__PURE__ */ jsx29(AppText, { className: "text-lg font-semibold", style: { color: colors.text }, children: "\u9009\u62E9\u65E5\u671F" }),
-                /* @__PURE__ */ jsx29(TouchableOpacity6, { onPress: handleConfirm, children: /* @__PURE__ */ jsx29(AppText, { style: { color: colors.primary }, className: "font-medium", children: "\u786E\u5B9A" }) })
+                /* @__PURE__ */ jsx29(TouchableOpacity6, { onPress: () => setVisible(false), children: /* @__PURE__ */ jsx29(AppText, { style: { color: colors.textMuted }, children: cancelText }) }),
+                /* @__PURE__ */ jsx29(AppText, { className: "text-lg font-semibold", style: { color: colors.text }, children: pickerTitle }),
+                /* @__PURE__ */ jsx29(TouchableOpacity6, { onPress: handleConfirm, children: /* @__PURE__ */ jsx29(AppText, { style: { color: colors.primary }, className: "font-medium", children: confirmText }) })
               ]
             }
           ),
-          /* @__PURE__ */ jsx29(AppView, { center: true, className: "py-4", style: { backgroundColor: colors.headerSurface }, children: /* @__PURE__ */ jsx29(AppText, { className: "text-2xl font-semibold", style: { color: colors.text }, children: formatDate(tempDate, "yyyy\u5E74MM\u6708dd\u65E5") }) }),
+          /* @__PURE__ */ jsx29(AppView, { center: true, className: "py-4", style: { backgroundColor: colors.headerSurface }, children: /* @__PURE__ */ jsx29(AppText, { className: "text-2xl font-semibold", style: { color: colors.text }, children: formatDate(tempDate, pickerDateFormat) }) }),
           /* @__PURE__ */ jsxs11(AppView, { row: true, className: "h-48", children: [
             /* @__PURE__ */ jsx29(
               PickerColumn,
               {
-                title: "\u5E74",
+                title: yearLabel,
                 values: years,
                 selectedValue: tempDate.getFullYear(),
                 onSelect: (year) => updateTempDate(year),
@@ -3192,7 +3251,7 @@ function DatePicker({
             /* @__PURE__ */ jsx29(
               PickerColumn,
               {
-                title: "\u6708",
+                title: monthLabel,
                 values: months,
                 selectedValue: tempDate.getMonth() + 1,
                 onSelect: (month) => updateTempDate(void 0, month),
@@ -3205,7 +3264,7 @@ function DatePicker({
             /* @__PURE__ */ jsx29(
               PickerColumn,
               {
-                title: "\u65E5",
+                title: dayLabel,
                 values: days,
                 selectedValue: tempDate.getDate(),
                 onSelect: (day) => updateTempDate(void 0, void 0, day),
@@ -3227,7 +3286,7 @@ function DatePicker({
                     className: "flex-1 py-2 items-center rounded-lg",
                     style: { backgroundColor: colors.surfaceMuted },
                     onPress: () => setTempDate(/* @__PURE__ */ new Date()),
-                    children: /* @__PURE__ */ jsx29(AppText, { style: { color: colors.text }, children: "\u4ECA\u5929" })
+                    children: /* @__PURE__ */ jsx29(AppText, { style: { color: colors.text }, children: todayText })
                   }
                 ),
                 minDate && /* @__PURE__ */ jsx29(
@@ -3236,7 +3295,7 @@ function DatePicker({
                     className: "flex-1 py-2 items-center rounded-lg",
                     style: { backgroundColor: colors.surfaceMuted },
                     onPress: () => setTempDate(minDate),
-                    children: /* @__PURE__ */ jsx29(AppText, { style: { color: colors.text }, children: "\u6700\u65E9" })
+                    children: /* @__PURE__ */ jsx29(AppText, { style: { color: colors.text }, children: minDateText })
                   }
                 ),
                 maxDate && /* @__PURE__ */ jsx29(
@@ -3245,7 +3304,7 @@ function DatePicker({
                     className: "flex-1 py-2 items-center rounded-lg",
                     style: { backgroundColor: colors.surfaceMuted },
                     onPress: () => setTempDate(maxDate),
-                    children: /* @__PURE__ */ jsx29(AppText, { style: { color: colors.text }, children: "\u6700\u665A" })
+                    children: /* @__PURE__ */ jsx29(AppText, { style: { color: colors.text }, children: maxDateText })
                   }
                 )
               ]
@@ -4268,6 +4327,7 @@ import { SafeAreaProvider } from "react-native-safe-area-context";
 
 // src/overlay/AppStatusBar.tsx
 import { StatusBar } from "react-native";
+import { useIsFocused as useIsFocused2 } from "@react-navigation/native";
 import { jsx as jsx38 } from "nativewind/jsx-runtime";
 function AppStatusBar({
   barStyle = "auto",
@@ -4288,6 +4348,11 @@ function AppStatusBar({
     }
   );
 }
+function AppFocusedStatusBar(props) {
+  const isFocused = useIsFocused2();
+  if (!isFocused) return null;
+  return /* @__PURE__ */ jsx38(AppStatusBar, { ...props });
+}
 
 // src/overlay/loading/provider.tsx
 import { useState as useState27, useCallback as useCallback19 } from "react";
@@ -4626,12 +4691,14 @@ export {
   ActionIcons,
   Alert,
   AppButton,
+  AppFocusedStatusBar,
   AppHeader,
   AppImage,
   AppInput,
   AppList,
   AppPressable,
   AppProvider,
+  AppScreen,
   AppScrollView,
   AppStatusBar,
   AppText,
@@ -4656,7 +4723,6 @@ export {
   NavigationIcons,
   NavigationProvider,
   OverlayProvider,
-  Page,
   PageDrawer,
   Progress,
   Radio,