@beyondcorp/beyond-ui-native 0.1.2 → 0.1.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (71) hide show
  1. package/dist/index.js +78 -61
  2. package/dist/index.js.map +1 -1
  3. package/dist/index.mjs +78 -61
  4. package/dist/index.mjs.map +1 -1
  5. package/package.json +11 -5
  6. package/src/components/accordion/accordion.tsx +245 -0
  7. package/src/components/accordion/index.ts +1 -0
  8. package/src/components/alert/alert.tsx +118 -0
  9. package/src/components/alert/index.ts +1 -0
  10. package/src/components/avatar/avatar.tsx +125 -0
  11. package/src/components/avatar/index.ts +1 -0
  12. package/src/components/badge/badge.tsx +89 -0
  13. package/src/components/badge/index.ts +1 -0
  14. package/src/components/bottom-sheet/bottom-sheet.tsx +336 -0
  15. package/src/components/bottom-sheet/index.ts +1 -0
  16. package/src/components/button/button.tsx +172 -0
  17. package/src/components/button/index.ts +1 -0
  18. package/src/components/card/card.tsx +121 -0
  19. package/src/components/card/index.ts +1 -0
  20. package/src/components/checkbox/checkbox.tsx +100 -0
  21. package/src/components/checkbox/index.ts +1 -0
  22. package/src/components/data-table/data-table.tsx +276 -0
  23. package/src/components/data-table/index.ts +1 -0
  24. package/src/components/dialog/dialog.tsx +278 -0
  25. package/src/components/dialog/index.ts +1 -0
  26. package/src/components/input/index.ts +1 -0
  27. package/src/components/input/input.tsx +130 -0
  28. package/src/components/radio/index.ts +1 -0
  29. package/src/components/radio/radio.tsx +117 -0
  30. package/src/components/select/index.ts +1 -0
  31. package/src/components/select/select.tsx +377 -0
  32. package/src/components/separator/index.ts +1 -0
  33. package/src/components/separator/separator.tsx +28 -0
  34. package/src/components/skeleton/index.ts +1 -0
  35. package/src/components/skeleton/skeleton.tsx +43 -0
  36. package/src/components/spinner/index.ts +1 -0
  37. package/src/components/spinner/spinner.tsx +46 -0
  38. package/src/components/stats-card/index.ts +1 -0
  39. package/src/components/stats-card/stats-card.tsx +92 -0
  40. package/src/components/switch/index.ts +1 -0
  41. package/src/components/switch/switch.tsx +80 -0
  42. package/src/components/tabs/index.ts +1 -0
  43. package/src/components/tabs/tabs.tsx +172 -0
  44. package/src/components/text/heading.tsx +50 -0
  45. package/src/components/text/index.ts +2 -0
  46. package/src/components/text/text.tsx +62 -0
  47. package/src/components/textarea/index.ts +1 -0
  48. package/src/components/textarea/textarea.tsx +87 -0
  49. package/src/components/toast/index.ts +2 -0
  50. package/src/components/toast/toast.tsx +136 -0
  51. package/src/components/toast/types.ts +32 -0
  52. package/src/index.ts +42 -0
  53. package/src/primitives/box.tsx +25 -0
  54. package/src/primitives/index.ts +2 -0
  55. package/src/primitives/pressable.tsx +49 -0
  56. package/src/providers/BeyondUIProvider.tsx +119 -0
  57. package/src/templates/auth/ForgotPasswordTemplate.tsx +132 -0
  58. package/src/templates/auth/SignInTemplate.tsx +213 -0
  59. package/src/templates/auth/SignUpTemplate.tsx +233 -0
  60. package/src/templates/auth/index.ts +3 -0
  61. package/src/templates/dashboard/DashboardTemplate.tsx +204 -0
  62. package/src/templates/dashboard/index.ts +1 -0
  63. package/src/templates/index.ts +3 -0
  64. package/src/templates/settings/SettingsTemplate.tsx +226 -0
  65. package/src/templates/settings/index.ts +1 -0
  66. package/src/theme/preset.ts +45 -0
  67. package/src/theme/tokens.ts +144 -0
  68. package/src/types/nativewind-env.d.ts +26 -0
  69. package/src/utilities/accessibility.ts +43 -0
  70. package/src/utilities/cn.ts +9 -0
  71. package/src/utilities/index.ts +2 -0
package/dist/index.js CHANGED
@@ -2006,12 +2006,12 @@ var BottomSheetContent = React20.forwardRef(
2006
2006
  ref,
2007
2007
  style: { transform: [{ translateY }] },
2008
2008
  className: cn(
2009
- "w-full bg-card rounded-t-3xl border-t border-border shadow-2xl pt-2 pb-8 px-6 max-h-[85%]",
2009
+ "w-full bg-white dark:bg-neutral-900 rounded-t-3xl border-t border-neutral-200 dark:border-neutral-800 shadow-2xl pt-2 pb-8 px-6 max-h-[85%]",
2010
2010
  className
2011
2011
  ),
2012
2012
  ...props,
2013
2013
  children: [
2014
- /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_native23.View, { ...panResponder.panHandlers, className: "w-full py-2 items-center", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_native23.View, { className: "w-12 h-1.5 rounded-full bg-muted/40" }) }),
2014
+ /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_native23.View, { ...panResponder.panHandlers, className: "w-full py-2 items-center", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_native23.View, { className: "w-12 h-1.5 rounded-full bg-neutral-300 dark:bg-neutral-700" }) }),
2015
2015
  children
2016
2016
  ]
2017
2017
  }
@@ -2030,14 +2030,14 @@ var BottomSheetTitle = ({
2030
2030
  className,
2031
2031
  children
2032
2032
  }) => {
2033
- return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Heading, { level: 4, className: cn("text-xl font-bold text-foreground", className), children });
2033
+ return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Heading, { level: 4, className: cn("text-xl font-bold text-neutral-900 dark:text-neutral-50", className), children });
2034
2034
  };
2035
2035
  BottomSheetTitle.displayName = "BottomSheetTitle";
2036
2036
  var BottomSheetDescription = ({
2037
2037
  className,
2038
2038
  children
2039
2039
  }) => {
2040
- return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Text2, { className: cn("text-sm text-muted", className), children });
2040
+ return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Text2, { className: cn("text-sm text-neutral-500 dark:text-neutral-400", className), children });
2041
2041
  };
2042
2042
  BottomSheetDescription.displayName = "BottomSheetDescription";
2043
2043
  var BottomSheetBody = React20.forwardRef(
@@ -2080,11 +2080,11 @@ var import_react_native24 = require("react-native");
2080
2080
  var import_class_variance_authority10 = require("class-variance-authority");
2081
2081
  var import_jsx_runtime24 = require("react/jsx-runtime");
2082
2082
  var selectTriggerVariants = (0, import_class_variance_authority10.cva)(
2083
- "flex-row items-center justify-between rounded-xl border bg-card px-4 py-3 active:opacity-80",
2083
+ "flex-row items-center justify-between rounded-xl border bg-white dark:bg-neutral-900 px-4 py-3 active:opacity-80",
2084
2084
  {
2085
2085
  variants: {
2086
2086
  variant: {
2087
- default: "border-border",
2087
+ default: "border-neutral-300 dark:border-neutral-700",
2088
2088
  error: "border-danger",
2089
2089
  success: "border-success"
2090
2090
  },
@@ -2160,7 +2160,7 @@ var Select = ({
2160
2160
  onSelect: handleSelect
2161
2161
  },
2162
2162
  children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: cn("w-full gap-1.5", className), children: [
2163
- label && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-sm font-medium text-foreground", children: label }),
2163
+ label && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-sm font-medium text-neutral-800 dark:text-neutral-200", children: label }),
2164
2164
  children ? children : /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
2165
2165
  import_react_native24.Pressable,
2166
2166
  {
@@ -2178,16 +2178,16 @@ var Select = ({
2178
2178
  {
2179
2179
  className: cn(
2180
2180
  "text-base",
2181
- displayLabel ? "text-foreground font-medium" : "text-muted"
2181
+ displayLabel ? "text-neutral-900 dark:text-neutral-100 font-medium" : "text-neutral-500 dark:text-neutral-400 font-normal"
2182
2182
  ),
2183
2183
  children: displayLabel || placeholder
2184
2184
  }
2185
2185
  ),
2186
- /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-muted text-xs", children: "\u25BC" })
2186
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-neutral-500 dark:text-neutral-400 text-xs", children: "\u25BC" })
2187
2187
  ]
2188
2188
  }
2189
2189
  ),
2190
- error ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-xs text-danger font-medium", children: error }) : helperText ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-xs text-muted", children: helperText }) : null,
2190
+ error ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-xs text-danger font-medium", children: error }) : helperText ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-xs text-neutral-500 dark:text-neutral-400", children: helperText }) : null,
2191
2191
  options && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
2192
2192
  import_react_native24.Modal,
2193
2193
  {
@@ -2198,10 +2198,10 @@ var Select = ({
2198
2198
  statusBarTranslucent: true,
2199
2199
  children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: "flex-1 justify-end bg-black/60", children: [
2200
2200
  /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.Pressable, { className: "flex-1", onPress: () => setOpen(false) }),
2201
- /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: "w-full bg-card rounded-t-3xl border-t border-border p-6 max-h-[75%]", children: [
2202
- /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: "flex-row items-center justify-between pb-4 border-b border-border mb-3", children: [
2203
- /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-lg font-bold text-foreground", children: label || placeholder }),
2204
- /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.Pressable, { onPress: () => setOpen(false), className: "p-1", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-muted text-lg font-semibold", children: "\u2715" }) })
2201
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: "w-full bg-white dark:bg-neutral-900 rounded-t-3xl border-t border-neutral-200 dark:border-neutral-800 p-6 max-h-[75%]", children: [
2202
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: "flex-row items-center justify-between pb-4 border-b border-neutral-200 dark:border-neutral-800 mb-3", children: [
2203
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-lg font-bold text-neutral-900 dark:text-neutral-50", children: label || placeholder }),
2204
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.Pressable, { onPress: () => setOpen(false), className: "p-1", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-neutral-500 dark:text-neutral-400 text-lg font-semibold", children: "\u2715" }) })
2205
2205
  ] }),
2206
2206
  searchable && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.View, { className: "mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
2207
2207
  import_react_native24.TextInput,
@@ -2210,10 +2210,10 @@ var Select = ({
2210
2210
  onChangeText: setSearchQuery,
2211
2211
  placeholder: "Search options...",
2212
2212
  placeholderTextColor: "#9ca3af",
2213
- className: "h-11 px-4 rounded-xl border border-border bg-background text-foreground text-base"
2213
+ className: "h-11 px-4 rounded-xl border border-neutral-300 dark:border-neutral-700 bg-neutral-50 dark:bg-neutral-800 text-neutral-900 dark:text-neutral-100 text-base"
2214
2214
  }
2215
2215
  ) }),
2216
- /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.ScrollView, { className: "max-h-80", showsVerticalScrollIndicator: false, children: filteredOptions.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.View, { className: "py-8 items-center", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-muted text-sm", children: "No options found" }) }) : filteredOptions.map((opt) => {
2216
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.ScrollView, { className: "max-h-80", showsVerticalScrollIndicator: false, children: filteredOptions.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.View, { className: "py-8 items-center", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-neutral-500 dark:text-neutral-400 text-sm", children: "No options found" }) }) : filteredOptions.map((opt) => {
2217
2217
  const isSelected = opt.value === currentValue;
2218
2218
  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
2219
2219
  import_react_native24.Pressable,
@@ -2221,8 +2221,8 @@ var Select = ({
2221
2221
  disabled: opt.disabled,
2222
2222
  onPress: () => handleSelect(opt.value),
2223
2223
  className: cn(
2224
- "flex-row items-center justify-between py-3.5 px-3 rounded-xl active:bg-muted/10",
2225
- isSelected && "bg-primary/10",
2224
+ "flex-row items-center justify-between py-3.5 px-3 rounded-xl active:bg-neutral-100 dark:active:bg-neutral-800",
2225
+ isSelected && "bg-primary-50 dark:bg-primary-950/40",
2226
2226
  opt.disabled && "opacity-40"
2227
2227
  ),
2228
2228
  children: [
@@ -2231,12 +2231,12 @@ var Select = ({
2231
2231
  {
2232
2232
  className: cn(
2233
2233
  "text-base",
2234
- isSelected ? "text-primary font-semibold" : "text-foreground font-normal"
2234
+ isSelected ? "text-primary-600 dark:text-primary-400 font-semibold" : "text-neutral-900 dark:text-neutral-100 font-normal"
2235
2235
  ),
2236
2236
  children: opt.label
2237
2237
  }
2238
2238
  ),
2239
- isSelected && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-primary font-bold text-base", children: "\u2713" })
2239
+ isSelected && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-primary-600 dark:text-primary-400 font-bold text-base", children: "\u2713" })
2240
2240
  ]
2241
2241
  },
2242
2242
  opt.value
@@ -2264,13 +2264,13 @@ var SelectTrigger = ({
2264
2264
  accessibilityRole: "combobox",
2265
2265
  accessibilityState: { expanded: open },
2266
2266
  className: cn(
2267
- "flex-row items-center justify-between rounded-xl border border-border bg-card px-4 py-3 active:opacity-80",
2267
+ "flex-row items-center justify-between rounded-xl border border-neutral-300 dark:border-neutral-700 bg-white dark:bg-neutral-900 px-4 py-3 active:opacity-80",
2268
2268
  className
2269
2269
  ),
2270
2270
  ...props,
2271
2271
  children: [
2272
2272
  children,
2273
- /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-muted text-xs", children: "\u25BC" })
2273
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-neutral-500 dark:text-neutral-400 text-xs", children: "\u25BC" })
2274
2274
  ]
2275
2275
  }
2276
2276
  );
@@ -2286,7 +2286,7 @@ var SelectValue = ({
2286
2286
  {
2287
2287
  className: cn(
2288
2288
  "text-base",
2289
- value ? "text-foreground font-medium" : "text-muted",
2289
+ value ? "text-neutral-900 dark:text-neutral-100 font-medium" : "text-neutral-500 dark:text-neutral-400",
2290
2290
  className
2291
2291
  ),
2292
2292
  children: value || placeholder
@@ -2307,10 +2307,10 @@ var SelectContent = ({ title, children }) => {
2307
2307
  statusBarTranslucent: true,
2308
2308
  children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: "flex-1 justify-end bg-black/60", children: [
2309
2309
  /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.Pressable, { className: "flex-1", onPress: () => setOpen(false) }),
2310
- /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: "w-full bg-card rounded-t-3xl border-t border-border p-6 max-h-[75%]", children: [
2311
- /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: "flex-row items-center justify-between pb-3 border-b border-border mb-3", children: [
2312
- /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-lg font-bold text-foreground", children: title || "Select" }),
2313
- /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.Pressable, { onPress: () => setOpen(false), className: "p-1", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-muted text-lg font-semibold", children: "\u2715" }) })
2310
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: "w-full bg-white dark:bg-neutral-900 rounded-t-3xl border-t border-neutral-200 dark:border-neutral-800 p-6 max-h-[75%]", children: [
2311
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { className: "flex-row items-center justify-between pb-3 border-b border-neutral-200 dark:border-neutral-800 mb-3", children: [
2312
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-lg font-bold text-neutral-900 dark:text-neutral-100", children: title || "Select" }),
2313
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.Pressable, { onPress: () => setOpen(false), className: "p-1", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-neutral-500 dark:text-neutral-400 text-lg font-semibold", children: "\u2715" }) })
2314
2314
  ] }),
2315
2315
  /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.ScrollView, { className: "max-h-80", children })
2316
2316
  ] })
@@ -2331,8 +2331,8 @@ var SelectItem = ({
2331
2331
  {
2332
2332
  onPress: () => onSelect(itemValue),
2333
2333
  className: cn(
2334
- "flex-row items-center justify-between py-3.5 px-3 rounded-xl active:bg-muted/10",
2335
- isSelected && "bg-primary/10",
2334
+ "flex-row items-center justify-between py-3.5 px-3 rounded-xl active:bg-neutral-100 dark:active:bg-neutral-800",
2335
+ isSelected && "bg-primary-50 dark:bg-primary-950/40",
2336
2336
  className
2337
2337
  ),
2338
2338
  children: [
@@ -2341,12 +2341,12 @@ var SelectItem = ({
2341
2341
  {
2342
2342
  className: cn(
2343
2343
  "text-base",
2344
- isSelected ? "text-primary font-semibold" : "text-foreground font-normal"
2344
+ isSelected ? "text-primary-600 dark:text-primary-400 font-semibold" : "text-neutral-900 dark:text-neutral-100 font-normal"
2345
2345
  ),
2346
2346
  children
2347
2347
  }
2348
2348
  ) : children,
2349
- isSelected && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-primary font-bold text-base", children: "\u2713" })
2349
+ isSelected && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Text2, { className: "text-primary-600 dark:text-primary-400 font-bold text-base", children: "\u2713" })
2350
2350
  ]
2351
2351
  }
2352
2352
  );
@@ -2431,11 +2431,10 @@ function DataTable({
2431
2431
  onChangeText: (val) => {
2432
2432
  setSearch(val);
2433
2433
  setCurrentPage(1);
2434
- },
2435
- className: "bg-card"
2434
+ }
2436
2435
  }
2437
2436
  ),
2438
- loading ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_native25.View, { className: "gap-3", children: [1, 2, 3].map((idx) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Skeleton, { className: "h-20 w-full rounded-2xl" }, idx)) }) : paginatedData.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Card, { className: "items-center justify-center p-8", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-muted text-base", children: emptyText }) }) : mode === "card" ? (
2437
+ loading ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_native25.View, { className: "gap-3", children: [1, 2, 3].map((idx) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Skeleton, { className: "h-20 w-full rounded-2xl" }, idx)) }) : paginatedData.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Card, { className: "items-center justify-center p-8", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-neutral-500 dark:text-neutral-400 text-base", children: emptyText }) }) : mode === "card" ? (
2439
2438
  /* Mobile Card Mode */
2440
2439
  /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_native25.View, { className: "gap-3", children: paginatedData.map((item, idx) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
2441
2440
  import_react_native25.Pressable,
@@ -2449,10 +2448,10 @@ function DataTable({
2449
2448
  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
2450
2449
  import_react_native25.View,
2451
2450
  {
2452
- className: "flex-row items-center justify-between py-1 border-b border-border/40 last:border-b-0",
2451
+ className: "flex-row items-center justify-between py-1 border-b border-neutral-200 dark:border-neutral-800 last:border-b-0",
2453
2452
  children: [
2454
- /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-xs font-semibold text-muted uppercase tracking-wider", children: col.title }),
2455
- /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_native25.View, { className: "shrink", children: typeof renderedVal === "string" ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-sm font-medium text-foreground", children: renderedVal }) : renderedVal })
2453
+ /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-xs font-semibold text-neutral-500 dark:text-neutral-400 uppercase tracking-wider", children: col.title }),
2454
+ /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_native25.View, { className: "shrink", children: typeof renderedVal === "string" ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-sm font-medium text-neutral-900 dark:text-neutral-100", children: renderedVal }) : renderedVal })
2456
2455
  ]
2457
2456
  },
2458
2457
  String(col.key)
@@ -2463,8 +2462,8 @@ function DataTable({
2463
2462
  )) })
2464
2463
  ) : (
2465
2464
  /* Horizontal Table Mode */
2466
- /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_native25.ScrollView, { horizontal: true, showsHorizontalScrollIndicator: false, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_react_native25.View, { className: "rounded-2xl border border-border bg-card overflow-hidden", children: [
2467
- /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_native25.View, { className: "flex-row bg-muted/10 border-b border-border", children: columns.map((col) => /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
2465
+ /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_native25.ScrollView, { horizontal: true, showsHorizontalScrollIndicator: false, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_react_native25.View, { className: "rounded-2xl border border-neutral-200 dark:border-neutral-800 bg-white dark:bg-neutral-900 overflow-hidden", children: [
2466
+ /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_native25.View, { className: "flex-row bg-neutral-100 dark:bg-neutral-800/60 border-b border-neutral-200 dark:border-neutral-800", children: columns.map((col) => /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
2468
2467
  import_react_native25.Pressable,
2469
2468
  {
2470
2469
  disabled: !col.sortable,
@@ -2472,8 +2471,8 @@ function DataTable({
2472
2471
  style: { width: col.width || 120 },
2473
2472
  className: "px-4 py-3 flex-row items-center justify-between",
2474
2473
  children: [
2475
- /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-xs font-bold text-foreground uppercase tracking-wider", children: col.title }),
2476
- col.sortable && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-xs text-muted", children: sortKey === col.key ? sortDirection === "asc" ? "\u25B2" : "\u25BC" : "\u21C5" })
2474
+ /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-xs font-bold text-neutral-900 dark:text-neutral-100 uppercase tracking-wider", children: col.title }),
2475
+ col.sortable && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-xs text-neutral-500 dark:text-neutral-400", children: sortKey === col.key ? sortDirection === "asc" ? "\u25B2" : "\u25BC" : "\u21C5" })
2477
2476
  ]
2478
2477
  },
2479
2478
  String(col.key)
@@ -2483,7 +2482,7 @@ function DataTable({
2483
2482
  {
2484
2483
  disabled: !onRowPress,
2485
2484
  onPress: () => onRowPress?.(item),
2486
- className: "flex-row border-b border-border/60 active:bg-muted/10",
2485
+ className: "flex-row border-b border-neutral-200 dark:border-neutral-800 active:bg-neutral-100 dark:active:bg-neutral-800",
2487
2486
  children: columns.map((col) => {
2488
2487
  const rawVal = item[col.key];
2489
2488
  const renderedVal = col.render ? col.render(rawVal, item) : String(rawVal ?? "\u2014");
@@ -2492,7 +2491,7 @@ function DataTable({
2492
2491
  {
2493
2492
  style: { width: col.width || 120 },
2494
2493
  className: "px-4 py-3 justify-center",
2495
- children: typeof renderedVal === "string" ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-sm text-foreground", children: renderedVal }) : renderedVal
2494
+ children: typeof renderedVal === "string" ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text2, { className: "text-sm text-neutral-900 dark:text-neutral-100", children: renderedVal }) : renderedVal
2496
2495
  },
2497
2496
  String(col.key)
2498
2497
  );
@@ -2503,7 +2502,7 @@ function DataTable({
2503
2502
  ] }) })
2504
2503
  ),
2505
2504
  totalPages > 1 && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_react_native25.View, { className: "flex-row items-center justify-between pt-2", children: [
2506
- /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(Text2, { className: "text-xs text-muted", children: [
2505
+ /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(Text2, { className: "text-xs text-neutral-500 dark:text-neutral-400", children: [
2507
2506
  "Showing ",
2508
2507
  (currentPage - 1) * pageSize + 1,
2509
2508
  " -",
@@ -2524,7 +2523,7 @@ function DataTable({
2524
2523
  children: "Prev"
2525
2524
  }
2526
2525
  ),
2527
- /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(Text2, { className: "text-xs font-medium text-foreground px-1", children: [
2526
+ /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(Text2, { className: "text-xs font-medium text-neutral-900 dark:text-neutral-100 px-1", children: [
2528
2527
  currentPage,
2529
2528
  " / ",
2530
2529
  totalPages
@@ -2988,8 +2987,8 @@ var DashboardTemplate = ({
2988
2987
  /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(AvatarFallback, { text: userName.slice(0, 2).toUpperCase() })
2989
2988
  ] }),
2990
2989
  /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react_native29.View, { children: [
2991
- /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-xs text-muted font-medium uppercase tracking-wider", children: userRole }),
2992
- /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(Heading, { level: 3, className: "text-xl font-bold text-foreground", children: [
2990
+ /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-xs text-neutral-500 dark:text-neutral-400 font-medium uppercase tracking-wider", children: userRole }),
2991
+ /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(Heading, { level: 3, className: "text-xl font-bold text-neutral-900 dark:text-neutral-50", children: [
2993
2992
  "Hello, ",
2994
2993
  userName,
2995
2994
  " \u{1F44B}"
@@ -3000,9 +2999,9 @@ var DashboardTemplate = ({
3000
2999
  import_react_native29.Pressable,
3001
3000
  {
3002
3001
  onPress: onNotificationPress,
3003
- className: "w-10 h-10 rounded-full border border-border bg-card items-center justify-center relative active:opacity-70",
3002
+ className: "w-10 h-10 rounded-full border border-neutral-200 dark:border-neutral-800 bg-white dark:bg-neutral-900 items-center justify-center relative active:opacity-70",
3004
3003
  children: [
3005
- /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-base text-foreground", children: "\u{1F514}" }),
3004
+ /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-base text-neutral-900 dark:text-neutral-100", children: "\u{1F514}" }),
3006
3005
  unreadNotificationsCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react_native29.View, { className: "absolute -top-1 -right-1 w-5 h-5 rounded-full bg-danger items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-[10px] font-bold text-white", children: unreadNotificationsCount > 9 ? "9+" : unreadNotificationsCount }) })
3007
3006
  ]
3008
3007
  }
@@ -3010,7 +3009,7 @@ var DashboardTemplate = ({
3010
3009
  ] }),
3011
3010
  /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react_native29.View, { className: "px-6 pt-6 gap-6", children: [
3012
3011
  quickActions && quickActions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react_native29.View, { className: "gap-2", children: [
3013
- /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-xs font-bold text-muted uppercase tracking-wider", children: "Quick Actions" }),
3012
+ /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-xs font-bold text-neutral-500 dark:text-neutral-400 uppercase tracking-wider", children: "Quick Actions" }),
3014
3013
  /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
3015
3014
  import_react_native29.ScrollView,
3016
3015
  {
@@ -3023,7 +3022,6 @@ var DashboardTemplate = ({
3023
3022
  variant: "outline",
3024
3023
  size: "sm",
3025
3024
  onPress: action.onPress,
3026
- className: "bg-card shadow-sm",
3027
3025
  children: action.icon ? `${action.icon} ${action.label}` : action.label
3028
3026
  },
3029
3027
  action.id
@@ -3032,18 +3030,18 @@ var DashboardTemplate = ({
3032
3030
  )
3033
3031
  ] }),
3034
3032
  /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react_native29.View, { className: "gap-3", children: [
3035
- /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-xs font-bold text-muted uppercase tracking-wider", children: "Overview Performance" }),
3033
+ /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-xs font-bold text-neutral-500 dark:text-neutral-400 uppercase tracking-wider", children: "Overview Performance" }),
3036
3034
  /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react_native29.View, { className: "gap-3", children: metrics.map((metric) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(StatsCard, { ...metric }, metric.id)) })
3037
3035
  ] }),
3038
3036
  recentActivities && recentActivities.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(Card, { className: "gap-2", children: [
3039
3037
  /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(CardHeader, { className: "flex-row items-center justify-between pb-2", children: [
3040
3038
  /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(CardTitle, { className: "text-base font-bold", children: "Recent Activity" }),
3041
- onViewAllActivities && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react_native29.Pressable, { onPress: onViewAllActivities, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-xs font-semibold text-primary", children: "View all" }) })
3039
+ onViewAllActivities && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react_native29.Pressable, { onPress: onViewAllActivities, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-xs font-semibold text-primary-600 dark:text-primary-400", children: "View all" }) })
3042
3040
  ] }),
3043
3041
  /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(CardContent, { className: "gap-3 pt-0", children: recentActivities.map((act) => /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
3044
3042
  import_react_native29.View,
3045
3043
  {
3046
- className: "flex-row items-center justify-between py-2 border-b border-border/40 last:border-b-0",
3044
+ className: "flex-row items-center justify-between py-2 border-b border-neutral-200 dark:border-neutral-800 last:border-b-0",
3047
3045
  children: [
3048
3046
  /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react_native29.View, { className: "flex-row items-center gap-3 flex-1 pr-2", children: [
3049
3047
  /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(Avatar, { size: "sm", children: [
@@ -3056,8 +3054,8 @@ var DashboardTemplate = ({
3056
3054
  )
3057
3055
  ] }),
3058
3056
  /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react_native29.View, { className: "flex-1", children: [
3059
- /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-sm font-semibold text-foreground", numberOfLines: 1, children: act.title }),
3060
- /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(Text2, { className: "text-xs text-muted", numberOfLines: 1, children: [
3057
+ /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-sm font-semibold text-neutral-900 dark:text-neutral-100", numberOfLines: 1, children: act.title }),
3058
+ /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(Text2, { className: "text-xs text-neutral-500 dark:text-neutral-400", numberOfLines: 1, children: [
3061
3059
  act.subtitle,
3062
3060
  " \u2022 ",
3063
3061
  act.timestamp
@@ -3065,7 +3063,7 @@ var DashboardTemplate = ({
3065
3063
  ] })
3066
3064
  ] }),
3067
3065
  /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react_native29.View, { className: "items-end gap-1", children: [
3068
- act.amount && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-sm font-bold text-foreground", children: act.amount }),
3066
+ act.amount && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text2, { className: "text-sm font-bold text-neutral-900 dark:text-neutral-100", children: act.amount }),
3069
3067
  act.status && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Badge, { variant: act.status.variant, size: "sm", children: act.status.label })
3070
3068
  ] })
3071
3069
  ]
@@ -3234,6 +3232,7 @@ var SettingsTemplate = ({
3234
3232
  // src/providers/BeyondUIProvider.tsx
3235
3233
  var React26 = __toESM(require("react"));
3236
3234
  var import_react_native31 = require("react-native");
3235
+ var import_nativewind = require("nativewind");
3237
3236
  var import_portal = require("@rn-primitives/portal");
3238
3237
  var import_jsx_runtime31 = require("react/jsx-runtime");
3239
3238
  var BeyondUIContext = React26.createContext({
@@ -3254,10 +3253,28 @@ function BeyondUIProvider({
3254
3253
  const [selectedScheme, setSelectedScheme] = React26.useState(defaultColorScheme);
3255
3254
  const [toasts, setToasts] = React26.useState([]);
3256
3255
  const activeScheme = selectedScheme === "system" ? systemScheme : selectedScheme;
3256
+ React26.useEffect(() => {
3257
+ try {
3258
+ import_nativewind.colorScheme.set(selectedScheme === "system" ? "system" : activeScheme);
3259
+ } catch (_) {
3260
+ }
3261
+ }, [selectedScheme, activeScheme]);
3262
+ const handleSetColorScheme = React26.useCallback((scheme) => {
3263
+ setSelectedScheme(scheme);
3264
+ try {
3265
+ import_nativewind.colorScheme.set(scheme === "system" ? "system" : scheme);
3266
+ } catch (_) {
3267
+ }
3268
+ }, []);
3257
3269
  const toggleColorScheme = React26.useCallback(() => {
3258
3270
  setSelectedScheme((prev) => {
3259
3271
  const current = prev === "system" ? systemScheme : prev;
3260
- return current === "dark" ? "light" : "dark";
3272
+ const next = current === "dark" ? "light" : "dark";
3273
+ try {
3274
+ import_nativewind.colorScheme.set(next);
3275
+ } catch (_) {
3276
+ }
3277
+ return next;
3261
3278
  });
3262
3279
  }, [systemScheme]);
3263
3280
  const dismissToast = React26.useCallback((id) => {
@@ -3284,16 +3301,16 @@ function BeyondUIProvider({
3284
3301
  const contextValue = React26.useMemo(
3285
3302
  () => ({
3286
3303
  colorScheme: activeScheme,
3287
- setColorScheme: setSelectedScheme,
3304
+ setColorScheme: handleSetColorScheme,
3288
3305
  toggleColorScheme
3289
3306
  }),
3290
- [activeScheme, toggleColorScheme]
3307
+ [activeScheme, handleSetColorScheme, toggleColorScheme]
3291
3308
  );
3292
3309
  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(BeyondUIContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ToastContext.Provider, { value: toastContextValue, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
3293
3310
  import_react_native31.View,
3294
3311
  {
3295
3312
  style: { flex: 1 },
3296
- className: activeScheme === "dark" ? "dark flex-1" : "flex-1",
3313
+ className: activeScheme === "dark" ? "dark flex-1 bg-neutral-950" : "flex-1 bg-white",
3297
3314
  children: [
3298
3315
  children,
3299
3316
  /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_portal.PortalHost, {}),