@buoy-gg/env 5.0.0 → 6.0.1

package/README.md

@@ -1,388 +1,74 @@
-# @buoy/env
+# @buoy-gg/env
 
-[![npm](https://img.shields.io/npm/v/@buoy%2Fenv)](https://www.npmjs.com/package/@buoy/env)
+[![npm version](https://img.shields.io/npm/v/@buoy-gg/env?style=flat-square&labelColor=1c1c1c&color=10B981)](https://www.npmjs.com/package/@buoy-gg/env) [![npm downloads](https://img.shields.io/npm/dm/@buoy-gg/env?style=flat-square&labelColor=1c1c1c&color=10B981)](https://www.npmjs.com/package/@buoy-gg/env)
 
-Environment variables inspector and validator for React Native development tools.
+**View and validate your app's environment variables on-device — auto-discovers `EXPO_PUBLIC_` vars with type detection and a 0-100% health score.**
 
-## Features
+Part of [Buoy](https://github.com/Buoy-gg/buoy) — devtools that live inside your React Native app. Install it and it auto-appears in the floating menu from [`@buoy-gg/core`](https://www.npmjs.com/package/@buoy-gg/core).
 
-- **Environment Variable Inspector**: Browse all environment variables in your app
-- **Required Variable Validation**: Define and validate required environment variables
-- **Type Checking**: Validate variable types (string, boolean, number, etc.)
-- **Value Validation**: Check if variables match expected values
-- **Search & Filtering**: Search and filter by variable name, value, or status
-- **Copy Functionality**: Easily copy variable values
-- **Beautiful UI**: Modern, game-themed interface matching other React Buoy tools
+![Environment Inspector demo](https://github.com/user-attachments/assets/75651046-33a0-4257-9011-3bcc4818a964)
 
-## Installation
-
-This package is part of the React Buoy monorepo and is automatically available to other packages and the example app.
-
-For external projects:
+## Install
 
 ```bash
-npm install @buoy/env
-# or
-pnpm add @buoy/env
-# or
-yarn add @buoy/env
+npm install @buoy-gg/core @buoy-gg/env
 ```
 
-## Quick Start
-
-### Simplest Setup - Just 1 Line!
-
-**Import the preset and add it to your tools array. Done!**
+## Quick start
 
-```typescript
-import { envToolPreset } from '@buoy/env';
-import { FloatingDevTools } from '@buoy/core';
+Fully automatic. Render the floating menu once — the Environment Inspector is auto-discovered as soon as this package is installed:
 
-const installedApps = [
-  envToolPreset, // That's it! One line.
-  // ...your other tools
-];
-
-function App() {
-  return (
-    <FloatingDevTools
-      apps={installedApps}
-      environment="local"
-      userRole="admin"
-    />
-  );
-}
-```
-
-**Done!** The preset automatically:
-- ✅ Inspects all environment variables
-- ✅ Provides search and filtering
-- ✅ Includes copy functionality
-- ✅ No configuration required
-
-### Custom Configuration
-
-If you need to validate specific environment variables:
-
-```typescript
-import { createEnvTool, createEnvVarConfig, envVar } from '@buoy/env';
-
-// Define required environment variables
-const requiredEnvVars = createEnvVarConfig([
-  envVar("EXPO_PUBLIC_API_URL").exists(),
-  envVar("EXPO_PUBLIC_DEBUG_MODE").withType("boolean").build(),
-  envVar("EXPO_PUBLIC_ENVIRONMENT").withValue("development").build(),
-]);
-
-// Create custom tool with validation
-const myEnvTool = createEnvTool({
-  requiredEnvVars,
-  colorPreset: "cyan",
-  enableSharedModalDimensions: true,
-});
-
-const installedApps = [
-  myEnvTool,
-  // ...other tools
-];
-```
-
-### Alternative: Manual Setup
-
-If you're not using FloatingDevTools or want more control:
-
-```typescript
-import { EnvVarsModal, createEnvVarConfig, envVar } from '@buoy/env';
-
-const requiredEnvVars = createEnvVarConfig([
-  envVar("EXPO_PUBLIC_API_URL").exists(),
-  envVar("EXPO_PUBLIC_DEBUG_MODE").withType("boolean").build(),
-]);
-
-function App() {
-  const [showEnv, setShowEnv] = useState(false);
+```tsx
+import { FloatingDevTools } from "@buoy-gg/core";
 
+export default function App() {
   return (
     <>
-      <Button onPress={() => setShowEnv(true)}>
-        Open Environment Inspector
-      </Button>
-
-      <EnvVarsModal
-        visible={showEnv}
-        onClose={() => setShowEnv(false)}
-        requiredEnvVars={requiredEnvVars}
-      />
+      {/* your app */}
+      <FloatingDevTools />
     </>
   );
 }
 ```
 
-## API Reference
-
-### Presets
-
-#### `envToolPreset`
-
-Pre-configured environment variables tool ready to use with FloatingDevTools.
-
-**Example:**
-```typescript
-import { envToolPreset } from '@buoy/env';
-
-const installedApps = [envToolPreset];
-```
-
-#### `createEnvTool(options?)`
-
-Create a custom environment variables tool configuration.
-
-**Options:**
-```typescript
-{
-  /** Tool name (default: "ENV") */
-  name?: string;
-  /** Tool description */
-  description?: string;
-  /** Icon color preset (default: "green") */
-  colorPreset?: "orange" | "cyan" | "purple" | "pink" | "yellow" | "green";
-  /** Custom tool ID (default: "env") */
-  id?: string;
-  /** Array of required environment variables to validate */
-  requiredEnvVars?: RequiredEnvVar[];
-  /** Enable shared modal dimensions */
-  enableSharedModalDimensions?: boolean;
-}
-```
-
-**Example:**
-```typescript
-import { createEnvTool, createEnvVarConfig, envVar } from '@buoy/env';
+To validate required variables, build the tool with `createEnvTool` and the fluent `envVar` builder, then pass it via `apps={[...]}`:
 
-const requiredEnvVars = createEnvVarConfig([
-  envVar("API_URL").exists(),
-  envVar("DEBUG").withType("boolean").build(),
-]);
+```tsx
+import { createEnvTool, envVar } from "@buoy-gg/env";
 
-const myEnvTool = createEnvTool({
-  name: "ENVIRONMENT",
-  requiredEnvVars,
-  colorPreset: "purple",
-  enableSharedModalDimensions: true,
+const envTool = createEnvTool({
+  requiredEnvVars: [
+    envVar("EXPO_PUBLIC_API_URL").exists(),
+    envVar("EXPO_PUBLIC_DEBUG_MODE").withType("boolean").build(),
+    envVar("EXPO_PUBLIC_ENVIRONMENT").withValue("development").build(),
+    envVar("EXPO_PUBLIC_MAX_RETRIES")
+      .withType("number")
+      .withDescription("Maximum API retry attempts")
+      .build(),
+  ],
 });
 ```
 
-### Components
-
-#### `EnvVarsModal`
-
-Main modal component for inspecting environment variables.
-
-**Props:**
-```typescript
-interface EnvVarsModalProps {
-  /** Whether the modal is visible */
-  visible: boolean;
-  /** Callback when modal is closed */
-  onClose: () => void;
-  /** List of required environment variables to validate */
-  requiredEnvVars: RequiredEnvVar[];
-  /** Optional back button handler */
-  onBack?: () => void;
-  /** Whether to use shared modal dimensions */
-  enableSharedModalDimensions?: boolean;
-}
-```
-
-**Example:**
-```typescript
-<EnvVarsModal
-  visible={isVisible}
-  onClose={handleClose}
-  requiredEnvVars={requiredEnvVars}
-/>
-```
-
-### Utilities
-
-#### `createEnvVarConfig(validators)`
-
-Create an array of required environment variables with validation rules.
-
-**Signature:**
-```typescript
-function createEnvVarConfig(
-  validators: EnvVarValidator[]
-): RequiredEnvVar[]
-```
-
-**Example:**
-```typescript
-import { createEnvVarConfig, envVar } from '@buoy/env';
-
-const config = createEnvVarConfig([
-  envVar("API_URL").exists(),
-  envVar("DEBUG").withType("boolean").build(),
-  envVar("ENVIRONMENT").withValue("production").build(),
-]);
-```
-
-#### `envVar(key)`
-
-Create a fluent validator for an environment variable.
-
-**Signature:**
-```typescript
-function envVar(key: string): EnvVarValidator
-```
-
-**Methods:**
-- `.exists()` - Validate that the variable exists
-- `.withType(type)` - Validate the variable type (string, boolean, number, etc.)
-- `.withValue(value)` - Validate the variable matches a specific value
-- `.build()` - Finalize the validator
-
-**Example:**
-```typescript
-import { envVar } from '@buoy/env';
-
-// Variable must exist
-envVar("API_URL").exists();
-
-// Variable must be a boolean
-envVar("DEBUG_MODE").withType("boolean").build();
-
-// Variable must match specific value
-envVar("ENVIRONMENT").withValue("staging").build();
-
-// Combined validation
-envVar("PORT")
-  .withType("number")
-  .withValue("3000")
-  .build();
-```
-
-### Types
-
-#### `RequiredEnvVar`
-
-```typescript
-interface RequiredEnvVar {
-  /** Environment variable key */
-  key: string;
-  /** Optional description */
-  description?: string;
-  /** Expected type */
-  expectedType?: "string" | "boolean" | "number" | "json";
-  /** Expected value */
-  expectedValue?: string;
-  /** Whether the variable must exist */
-  required?: boolean;
-}
-```
-
-#### `Environment`
-
-```typescript
-type Environment = 
-  | "local" 
-  | "development" 
-  | "staging" 
-  | "production" 
-  | string;
-```
-
-#### `UserRole`
-
-```typescript
-type UserRole = "admin" | "internal" | "user";
-```
-
-## Use Cases
-
-### API Configuration Validation
-
-```typescript
-import { createEnvTool, createEnvVarConfig, envVar } from '@buoy/env';
-
-const requiredEnvVars = createEnvVarConfig([
-  envVar("EXPO_PUBLIC_API_URL").exists(),
-  envVar("EXPO_PUBLIC_API_KEY").exists(),
-  envVar("EXPO_PUBLIC_API_TIMEOUT").withType("number").build(),
-]);
-
-const envTool = createEnvTool({ requiredEnvVars });
-```
-
-### Environment-Specific Validation
-
-```typescript
-import { createEnvVarConfig, envVar } from '@buoy/env';
-
-const requiredEnvVars = createEnvVarConfig([
-  envVar("EXPO_PUBLIC_ENVIRONMENT")
-    .withValue("development")
-    .build(),
-  envVar("EXPO_PUBLIC_DEBUG_MODE")
-    .withType("boolean")
-    .build(),
-  envVar("EXPO_PUBLIC_ENABLE_LOGGING")
-    .withType("boolean")
-    .build(),
-]);
-```
-
-### Feature Flag Configuration
-
-```typescript
-import { createEnvVarConfig, envVar } from '@buoy/env';
-
-const requiredEnvVars = createEnvVarConfig([
-  envVar("EXPO_PUBLIC_FEATURE_NEW_UI")
-    .withType("boolean")
-    .build(),
-  envVar("EXPO_PUBLIC_FEATURE_ANALYTICS")
-    .withType("boolean")
-    .build(),
-  envVar("EXPO_PUBLIC_FEATURE_BETA")
-    .withType("boolean")
-    .build(),
-]);
-```
-
-## Dependencies
+## What you get
 
-- `@buoy/shared-ui` - Common UI components and utilities
-- React and React Native (peer dependencies)
+- **Automatic discovery** — every `EXPO_PUBLIC_`-prefixed variable is collected with zero configuration.
+- **Required-variable validation** — declare which vars must exist, with expected values or types: `string`, `number`, `boolean`, `array`, `object`, `url`.
+- **Type detection** — values are auto-classified (string, number, boolean, array, object, url, json).
+- **Health score** — a 0-100% health percentage with HEALTHY / WARNING / ERROR / CRITICAL states, plus counts for total, required, missing, and wrong value/type.
+- **Per-variable status** — green (present and correct), yellow (wrong value or type), red (required but missing).
+- **Search and filters** — real-time search plus "All", "Missing", and "Issues" filters.
+- **Copy to clipboard** — copy any value with one tap.
 
-## Development
-
-### Building
-
-```bash
-pnpm build
-```
-
-### Type Checking
-
-```bash
-pnpm typecheck
-```
-
-### Clean Build
-
-```bash
-pnpm clean
-```
+## Desktop & AI
 
-## License
+The same live session streams to [Buoy Desktop](https://github.com/Buoy-gg/Buoy-Desktop) (free, macOS/Windows/Linux) and to Claude Code or Cursor via the [Buoy MCP server](https://buoy.gg/buoy/latest/docs/mcp).
 
-MIT
+## Free vs Pro
 
-## Contributing
+Every tool is free. [Pro](https://buoy.gg/pricing) unlocks production builds, the MCP server, and unlimited capture. Every weekend, Pro features unlock free for everyone.
 
-See the main repository [CONTRIBUTING.md](../../CONTRIBUTING.md) for contribution guidelines.
+---
 
-## Support
+📚 [Full docs](https://buoy.gg/buoy/latest/docs/tools/env) · [All Buoy tools](https://github.com/Buoy-gg/buoy)
 
-For issues and feature requests, please visit the [GitHub repository](https://github.com/LovesWorking/react-native-buoy/issues).
+Proprietary software. © Buoy LLC. [Terms](https://buoy.gg/terms)

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@buoy-gg/env",
-  "version": "5.0.0",
-  "description": "Environment variables dev tooling",
+  "version": "6.0.1",
+  "description": "Environment variable devtool for React Native — auto-discovers EXPO_PUBLIC_ vars, validates types, scores config health. Part of Buoy devtools.",
   "main": "lib/commonjs/index.js",
   "module": "lib/module/index.js",
   "types": "lib/typescript/index.d.ts",
@@ -26,8 +26,8 @@
   ],
   "sideEffects": false,
   "dependencies": {
-    "@buoy-gg/shared-ui": "5.0.0",
-    "@buoy-gg/floating-tools-core": "5.0.0"
+    "@buoy-gg/floating-tools-core": "6.0.1",
+    "@buoy-gg/shared-ui": "6.0.1"
   },
   "peerDependencies": {
     "react": "*",