@buoy-gg/env 7.0.39 → 7.0.41

package/README.md

@@ -97,3 +97,7 @@ Use a Free or Pro Buoy account. History limits and paid features vary by tool; s
 📚 [Full docs](https://buoy.gg/buoy/latest/docs/tools/env) · [All Buoy tools](https://github.com/Buoy-gg/buoy)
 
 Proprietary software. © Buoy LLC. [Terms](https://buoy.gg/terms)
+
+## Web support (unreleased)
+
+Supply public runtime values explicitly with setRemoteEnv. The inspector cannot enumerate variables that a bundler replaced at build time. The browser build is available in this checkout and has not been published yet. See the [web setup guide](https://buoy.gg/buoy/latest/docs/web-preview) for registration, dependencies, and browser boundaries.

package/lib/commonjs/env/hooks/useDynamicEnv.js

@@ -38,7 +38,7 @@ function useDynamicEnv({
   // synced device instead of the local process.env
   const envSource =
   // @ts-ignore process.env does exist
-  (0, _remoteEnv.getRemoteEnv)() ?? process.env;
+  (0, _remoteEnv.getRemoteEnv)() ?? (typeof process === "undefined" ? {} : process.env);
 
   // Helper function to get a single environment variable value
   const getEnvValue = (0, _react.useMemo)(() => {

package/lib/commonjs/preset.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.envToolPreset = exports.createEnvTool = void 0;
 var _floatingToolsCore = require("@buoy-gg/floating-tools-core");
 var _EnvVarsModal = require("./env/components/EnvVarsModal");
+var _envSyncAdapter = require("./sync/envSyncAdapter");
 var _sharedUi = require("@buoy-gg/shared-ui");
 var _jsxRuntime = require("react/jsx-runtime");
 /**
@@ -70,7 +71,11 @@ const envToolPreset = exports.envToolPreset = (0, _sharedUi.defineToolPreset)({
  * });
  * ```
  */
-const createEnvTool = exports.createEnvTool = (0, _sharedUi.createToolFactory)(envToolPreset, options => ({
-  requiredEnvVars: options.requiredEnvVars || [],
-  enableSharedModalDimensions: options.enableSharedModalDimensions ?? true
-}));
+const createEnvTool = exports.createEnvTool = (0, _sharedUi.createToolFactory)(envToolPreset, options => {
+  // Shared with the sync adapter so the desktop panel checks the same list.
+  (0, _envSyncAdapter.setToolRequiredEnvVars)(options.requiredEnvVars || []);
+  return {
+    requiredEnvVars: options.requiredEnvVars || [],
+    enableSharedModalDimensions: options.enableSharedModalDimensions ?? true
+  };
+});

package/lib/commonjs/sync/envSyncAdapter.js

@@ -4,11 +4,13 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.createEnvSyncAdapter = createEnvSyncAdapter;
+exports.setToolRequiredEnvVars = setToolRequiredEnvVars;
+var _remoteEnv = require("../env/utils/remoteEnv");
 /** Collect the device's env vars (only EXPO_PUBLIC_-style vars exist in RN). */
 function collectEnv() {
   const env = {};
   // @ts-ignore process.env does exist
-  for (const [key, value] of Object.entries(process.env)) {
+  for (const [key, value] of Object.entries((0, _remoteEnv.getRemoteEnv)() ?? (typeof process === "undefined" ? {} : process.env))) {
     if (typeof value === "string") {
       env[key] = value;
     }
@@ -25,12 +27,23 @@ function collectEnv() {
  * once when a dashboard starts watching. Pass the same `requiredEnvVars`
  * config you give FloatingDevTools so the dashboard validates against it.
  */
+let toolRequiredEnvVars = [];
+
+/**
+ * Called by `createEnvTool`. An app that declares its variables on the tool
+ * (`apps={[createEnvTool({ requiredEnvVars })]}`) rather than on
+ * FloatingDevTools used to sync an empty list, so the desktop panel checked
+ * nothing and showed no required variables.
+ */
+function setToolRequiredEnvVars(vars) {
+  toolRequiredEnvVars = vars;
+}
 function createEnvSyncAdapter(requiredEnvVars = []) {
   return {
     version: 1,
     getSnapshot: () => ({
       env: collectEnv(),
-      requiredEnvVars
+      requiredEnvVars: requiredEnvVars.length > 0 ? requiredEnvVars : toolRequiredEnvVars
     }),
     // Env never changes at runtime — nothing to subscribe to
     subscribe: () => () => {}

package/lib/module/env/hooks/useDynamicEnv.js

@@ -34,7 +34,7 @@ export function useDynamicEnv({
   // synced device instead of the local process.env
   const envSource =
   // @ts-ignore process.env does exist
-  getRemoteEnv() ?? process.env;
+  getRemoteEnv() ?? (typeof process === "undefined" ? {} : process.env);
 
   // Helper function to get a single environment variable value
   const getEnvValue = useMemo(() => {

package/lib/module/preset.js

@@ -19,6 +19,7 @@
 
 import { EnvIcon } from "@buoy-gg/floating-tools-core";
 import { EnvVarsModal } from "./env/components/EnvVarsModal";
+import { setToolRequiredEnvVars } from "./sync/envSyncAdapter";
 import { createToolFactory, defineToolPreset } from "@buoy-gg/shared-ui";
 
 /**
@@ -67,7 +68,11 @@ export const envToolPreset = defineToolPreset({
  * });
  * ```
  */
-export const createEnvTool = createToolFactory(envToolPreset, options => ({
-  requiredEnvVars: options.requiredEnvVars || [],
-  enableSharedModalDimensions: options.enableSharedModalDimensions ?? true
-}));
+export const createEnvTool = createToolFactory(envToolPreset, options => {
+  // Shared with the sync adapter so the desktop panel checks the same list.
+  setToolRequiredEnvVars(options.requiredEnvVars || []);
+  return {
+    requiredEnvVars: options.requiredEnvVars || [],
+    enableSharedModalDimensions: options.enableSharedModalDimensions ?? true
+  };
+});

package/lib/module/sync/envSyncAdapter.js

@@ -1,10 +1,11 @@
 "use strict";
 
+import { getRemoteEnv } from "../env/utils/remoteEnv";
 /** Collect the device's env vars (only EXPO_PUBLIC_-style vars exist in RN). */
 function collectEnv() {
   const env = {};
   // @ts-ignore process.env does exist
-  for (const [key, value] of Object.entries(process.env)) {
+  for (const [key, value] of Object.entries(getRemoteEnv() ?? (typeof process === "undefined" ? {} : process.env))) {
     if (typeof value === "string") {
       env[key] = value;
     }
@@ -21,12 +22,23 @@ function collectEnv() {
  * once when a dashboard starts watching. Pass the same `requiredEnvVars`
  * config you give FloatingDevTools so the dashboard validates against it.
  */
+let toolRequiredEnvVars = [];
+
+/**
+ * Called by `createEnvTool`. An app that declares its variables on the tool
+ * (`apps={[createEnvTool({ requiredEnvVars })]}`) rather than on
+ * FloatingDevTools used to sync an empty list, so the desktop panel checked
+ * nothing and showed no required variables.
+ */
+export function setToolRequiredEnvVars(vars) {
+  toolRequiredEnvVars = vars;
+}
 export function createEnvSyncAdapter(requiredEnvVars = []) {
   return {
     version: 1,
     getSnapshot: () => ({
       env: collectEnv(),
-      requiredEnvVars
+      requiredEnvVars: requiredEnvVars.length > 0 ? requiredEnvVars : toolRequiredEnvVars
     }),
     // Env never changes at runtime — nothing to subscribe to
     subscribe: () => () => {}

package/lib/typescript/preset.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"preset.d.ts","sourceRoot":"","sources":["../../src/preset.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAGH,OAAO,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAC7D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAGlD;;;;;;;GAOG;AACH,eAAO,MAAM,aAAa;;;;;qBAKP;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE;;;yBAGR,cAAc,EAAE;;;CAGzC,CAAC;AAEH;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,aAAa;IAGtB,0DAA0D;sBACxC,cAAc,EAAE;IAClC,qCAAqC;kCACP,OAAO;;;;;;qBAlCtB;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE;;;yBAGR,cAAc,EAAE;;;CAoC1C,CAAC"}
+{"version":3,"file":"preset.d.ts","sourceRoot":"","sources":["../../src/preset.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAGH,OAAO,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAC7D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAIlD;;;;;;;GAOG;AACH,eAAO,MAAM,aAAa;;;;;qBAKP;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE;;;yBAGR,cAAc,EAAE;;;CAGzC,CAAC;AAEH;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,aAAa;IAGtB,0DAA0D;sBACxC,cAAc,EAAE;IAClC,qCAAqC;kCACP,OAAO;;;;;;qBAlCtB;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE;;;yBAGR,cAAc,EAAE;;;CAwC1C,CAAC"}

package/lib/typescript/sync/envSyncAdapter.d.ts

@@ -1,13 +1,11 @@
 import type { RequiredEnvVar } from "../env/types/types";
 /**
- * Create a sync adapter for the env tool, consumed by @buoy-gg/external-sync's
- * `useExternalSync` (structurally matches its ToolSyncAdapter interface so
- * this package doesn't need a dependency on it).
- *
- * Env vars are baked into the bundle, so the snapshot is static — it's sent
- * once when a dashboard starts watching. Pass the same `requiredEnvVars`
- * config you give FloatingDevTools so the dashboard validates against it.
+ * Called by `createEnvTool`. An app that declares its variables on the tool
+ * (`apps={[createEnvTool({ requiredEnvVars })]}`) rather than on
+ * FloatingDevTools used to sync an empty list, so the desktop panel checked
+ * nothing and showed no required variables.
  */
+export declare function setToolRequiredEnvVars(vars: RequiredEnvVar[]): void;
 export declare function createEnvSyncAdapter(requiredEnvVars?: RequiredEnvVar[]): {
     version: number;
     getSnapshot: () => {

package/lib/typescript/sync/envSyncAdapter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"envSyncAdapter.d.ts","sourceRoot":"","sources":["../../../src/sync/envSyncAdapter.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAczD;;;;;;;;GAQG;AACH,wBAAgB,oBAAoB,CAAC,eAAe,GAAE,cAAc,EAAO;;;;;;;EAU1E"}
+{"version":3,"file":"envSyncAdapter.d.ts","sourceRoot":"","sources":["../../../src/sync/envSyncAdapter.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAyBzD;;;;;GAKG;AACH,wBAAgB,sBAAsB,CAAC,IAAI,EAAE,cAAc,EAAE,GAAG,IAAI,CAEnE;AAED,wBAAgB,oBAAoB,CAAC,eAAe,GAAE,cAAc,EAAO;;;;;;;EAU1E"}

package/lib/web/index.mjs

@@ -0,0 +1,2 @@
+"use client";
+var ye=Object.defineProperty;var _e=Object.getOwnPropertyDescriptor;var Le=Object.getOwnPropertyNames;var Ae=Object.prototype.hasOwnProperty;var Me=(e,t)=>{for(var o in t)ye(e,o,{get:t[o],enumerable:!0})},pe=(e,t,o,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of Le(t))!Ae.call(e,r)&&r!==o&&ye(e,r,{get:()=>t[r],enumerable:!(s=_e(t,r))||s.enumerable});return e},g=(e,t,o)=>(pe(e,t,"default"),o&&pe(o,t,"default"));typeof window<"u"&&typeof globalThis.global>"u"&&(globalThis.global=globalThis);import{EnvIcon as rn}from"@buoy-gg/floating-tools-core/web";import{JsModal as Gt,devToolsStorageKeys as Ee,ModalHeader as z,HeaderSearchButton as Ut,displayValue as Jt,buoyColors as K,night as Z,windowDragProps as Xt,ToolEmptyState as Qt,resolveListEmptyState as Yt,monoFont as Ve}from"@buoy-gg/shared-ui/web";import{useCallback as Zt,useState as ae,useRef as en,useEffect as Se,useMemo as F}from"react";var c={};Me(c,{AccessibilityInfo:()=>Qe,ActivityIndicator:()=>je,Alert:()=>Ue,Animated:()=>Ye,AppRegistry:()=>et,AppState:()=>tt,Appearance:()=>Ze,BackHandler:()=>nt,Button:()=>Ke,CheckBox:()=>vt,Clipboard:()=>ot,DeviceEventEmitter:()=>Lt,Dimensions:()=>rt,Easing:()=>it,FlatList:()=>ht,I18nManager:()=>st,Image:()=>xt,ImageBackground:()=>wt,InteractionManager:()=>lt,Keyboard:()=>at,KeyboardAvoidingView:()=>Tt,LayoutAnimation:()=>ct,Linking:()=>ut,LogBox:()=>_t,Modal:()=>ze,NativeEventEmitter:()=>dt,NativeModules:()=>Xe,PanResponder:()=>pt,Picker:()=>Et,PixelRatio:()=>yt,Platform:()=>ft,Pressable:()=>$e,ProgressBar:()=>Vt,RefreshControl:()=>St,SafeAreaView:()=>Ct,ScrollView:()=>ne,SectionList:()=>It,Share:()=>bt,StatusBar:()=>Rt,StyleSheet:()=>C,Switch:()=>Fe,Text:()=>y,TextInput:()=>He,Touchable:()=>kt,TouchableHighlight:()=>Be,TouchableNativeFeedback:()=>qt,TouchableOpacity:()=>B,TouchableWithoutFeedback:()=>Ne,UIManager:()=>gt,Vibration:()=>mt,View:()=>p,VirtualizedList:()=>Dt,YellowBox:()=>Wt,findNodeHandle:()=>Ge,unstable_createElement:()=>Je,useColorScheme:()=>At,useLocaleContext:()=>Mt,useWindowDimensions:()=>Ot});g(c,fn);import*as fn from"react-native-web";import{unstable_createElement as Je,NativeModules as Xe,AccessibilityInfo as Qe,Animated as Ye,Appearance as Ze,AppRegistry as et,AppState as tt,BackHandler as nt,Clipboard as ot,Dimensions as rt,Easing as it,I18nManager as st,Keyboard as at,InteractionManager as lt,LayoutAnimation as ct,Linking as ut,NativeEventEmitter as dt,PanResponder as pt,PixelRatio as yt,Platform as ft,Share as bt,StyleSheet as C,UIManager as gt,Vibration as mt,CheckBox as vt,FlatList as ht,Image as xt,ImageBackground as wt,KeyboardAvoidingView as Tt,Picker as Et,ProgressBar as Vt,RefreshControl as St,SafeAreaView as Ct,SectionList as It,StatusBar as Rt,Touchable as kt,TouchableNativeFeedback as qt,VirtualizedList as Dt,YellowBox as Wt,LogBox as _t,DeviceEventEmitter as Lt,useColorScheme as At,useLocaleContext as Mt,useWindowDimensions as Ot}from"react-native-web";import*as l from"react-native-web";import{createElement as Oe,forwardRef as Pe}from"react";function T(e){let t=Pe((s,r)=>{let{accessibilityState:n,accessibilityValue:a,...i}=s;for(let f of["busy","checked","disabled","expanded","selected"])n?.[f]!==void 0&&i[`aria-${f}`]===void 0&&(i[`aria-${f}`]=n[f]);for(let[f,u]of Object.entries({min:"valuemin",max:"valuemax",now:"valuenow",text:"valuetext"}))a?.[f]!==void 0&&i[`aria-${u}`]===void 0&&(i[`aria-${u}`]=a[f]);return Oe(e,{...i,ref:r})}),o=e.State;return o&&Object.assign(t,{State:o}),t.displayName=e.displayName??e.name??"NativeWebView",t}var p=T(l.View),y=T(l.Text),He=T(l.TextInput),B=T(l.TouchableOpacity),Be=T(l.TouchableHighlight),Ne=T(l.TouchableWithoutFeedback),$e=T(l.Pressable),ne=T(l.ScrollView),ze=T(l.Modal),Fe=T(l.Switch),je=T(l.ActivityIndicator),Ke=T(l.Button),Ge=l.findNodeHandle,Ue={alert(e,t,o,s){if(typeof document>"u")return;let r=document.createElement("dialog");r.dataset.buoyRoot="",r.setAttribute("aria-label",e),r.style.cssText="position:fixed;inset:0;margin:auto;width:min(440px,90vw);padding:24px;border:1px solid #475569;border-radius:14px;background:#17212e;color:#f1f5f9;font:14px system-ui;box-shadow:0 20px 80px #0008;z-index:2147483647";let n=document.createElement("h2");if(n.textContent=e,n.style.cssText="font-size:18px;margin:0 0 12px",r.appendChild(n),t){let u=document.createElement("p");u.textContent=t,u.style.cssText="line-height:1.5;white-space:pre-wrap;margin:0 0 20px",r.appendChild(u)}let a=document.createElement("div");a.style.cssText="display:flex;justify-content:flex-end;flex-wrap:wrap;gap:8px";let i=o?.length?o:[{text:"OK"}],f=()=>{r.close?.(),r.remove()};for(let u of i){let d=document.createElement("button");d.type="button",d.textContent=u.text??"OK",d.style.cssText=`padding:9px 14px;border:1px solid #64748b;border-radius:7px;color:white;background:${u.style==="destructive"?"#a52b38":"#283a4d"};cursor:pointer;font:inherit`,d.onclick=()=>{f(),u.onPress?.()},a.appendChild(d)}r.addEventListener("cancel",u=>{u.preventDefault(),s?.cancelable!==!1&&(f(),s?.onDismiss?.())}),r.appendChild(a),document.body.appendChild(r),r.showModal?r.showModal():r.setAttribute("open","")}};import{CompactRow as Pt,night as R,monoFont as fe}from"@buoy-gg/shared-ui/web";import{jsx as k,jsxs as A}from"react/jsx-runtime";function be({stats:e,healthPercentage:t,healthStatus:o,healthColor:s,activeFilter:r="all",onFilterChange:n}){let a=e.wrongValueCount+e.wrongTypeCount;return A(p,{style:b.container,children:[k(Pt,{statusDotColor:s,statusLabel:"System",statusSublabel:o.toLowerCase(),primaryText:"Environment Configuration",secondaryText:`${t}% healthy`,testID:"buoy-env-health",statusSublabelTestID:"buoy-env-health-status",accessibilityLabel:`Environment configuration ${o.toLowerCase()}, ${t}% healthy`,customBadge:k(p,{style:[b.percentBadge,{borderColor:s+"40",backgroundColor:s+"10"}],children:A(y,{style:[b.percentText,{color:s}],testID:"buoy-env-health-percent",children:[t,"%"]})})}),A(p,{style:b.statsGrid,children:[A(B,{style:[b.statCard,r==="all"&&b.statCardActive],onPress:()=>n?.("all"),activeOpacity:.8,testID:"buoy-env-filter-all",accessibilityRole:"button",accessibilityLabel:"Show all variables",accessibilityState:{selected:r==="all"},children:[k(y,{style:[b.statValue,r==="all"&&b.statValueActive],testID:"buoy-env-filter-all-count",children:e.requiredCount+e.optionalCount}),k(y,{style:[b.statLabel,r==="all"&&b.statLabelActive],children:"ALL"})]}),A(B,{style:[b.statCard,r==="missing"&&b.statCardActive],onPress:()=>n?.("missing"),activeOpacity:.8,testID:"buoy-env-filter-missing",accessibilityRole:"button",accessibilityLabel:"Show missing variables",accessibilityState:{selected:r==="missing"},children:[k(y,{style:[b.statValue,r==="missing"&&b.statValueActive],testID:"buoy-env-filter-missing-count",children:e.missingCount}),k(y,{style:[b.statLabel,r==="missing"&&b.statLabelActive],children:"MISSING"})]}),A(B,{style:[b.statCard,r==="issues"&&b.statCardActive],onPress:()=>n?.("issues"),activeOpacity:.8,testID:"buoy-env-filter-issues",accessibilityRole:"button",accessibilityLabel:"Show variables with issues",accessibilityState:{selected:r==="issues"},children:[k(y,{style:[b.statValue,r==="issues"&&b.statValueActive],testID:"buoy-env-filter-issues-count",children:a}),k(y,{style:[b.statLabel,r==="issues"&&b.statLabelActive],children:"ISSUES"})]})]})]})}var b=C.create({container:{gap:8},statsGrid:{flexDirection:"row",gap:8,paddingHorizontal:4},statCard:{flex:1,backgroundColor:R.color.surface,borderRadius:10,borderWidth:1,borderColor:R.color.border,padding:12,alignItems:"center",justifyContent:"center",minHeight:64},statCardActive:{borderColor:R.color.accentBorderStrong,backgroundColor:R.color.accentSoft},statValue:{fontSize:22,fontWeight:"700",fontFamily:fe,lineHeight:26,color:R.color.text},statValueActive:{color:R.color.accent},statLabel:{fontSize:9,color:R.color.textTertiary,marginTop:4,textTransform:"uppercase",letterSpacing:.5,fontWeight:"600"},statLabelActive:{color:R.color.accent},percentBadge:{paddingHorizontal:8,paddingVertical:4,borderRadius:6,borderWidth:1},percentText:{fontSize:14,fontWeight:"700",fontFamily:fe}});import{useMemo as me}from"react";var ge=null;function Ht(e){ge=e}function X(){return ge}function ve({envFilter:e=()=>!0}={}){let t=X()??(typeof process>"u"?{}:process.env),o=me(()=>r=>{let n=t[r];if(n===void 0)return null;try{if(n.startsWith("{")||n.startsWith("["))return JSON.parse(n);if(n.toLowerCase()==="true")return!0;if(n.toLowerCase()==="false")return!1;if(/^\d+$/.test(n)){let a=parseInt(n,10);return isNaN(a)?n:a}if(/^\d*\.\d+$/.test(n)){let a=parseFloat(n);return isNaN(a)?n:a}return n}catch{return n}},[t]);return me(()=>Object.keys(t).filter(a=>{let i=t[a];return e(a,i)}).map(a=>({key:a,data:o(a)})),[e,o,t])}function Q(e){let t=typeof e;if(t==="boolean")return"boolean";if(t==="number")return"number";if(Array.isArray(e))return"array";if(t==="object"&&e!==null)return"object";if(t==="string"){let o=e;if(o.startsWith("{")&&o.endsWith("}")||o.startsWith("[")&&o.endsWith("]"))try{let r=JSON.parse(o);return Array.isArray(r)?"array":"object"}catch{return"string"}let s=o.toLowerCase();return s==="true"||s==="false"||s==="enabled"||s==="disabled"||s==="yes"||s==="no"||s==="on"||s==="off"?"boolean":!isNaN(Number(o))&&o.trim()!==""?"number":o.startsWith("http://")||o.startsWith("https://")?"url":o.includes(",")?"array":"string"}return"unknown"}var oe=class{constructor(t){this.key=t}exists(){return this.key}withValue(t){return this.expectedValue=t,delete this.expectedType,this}withType(t){return this.expectedType=t,delete this.expectedValue,this}withDescription(t){return this.description=t,this}build(){return this.expectedValue!==void 0?this.description?{key:this.key,expectedValue:this.expectedValue,description:this.description}:{key:this.key,expectedValue:this.expectedValue}:this.expectedType!==void 0?this.description?{key:this.key,expectedType:this.expectedType,description:this.description}:{key:this.key,expectedType:this.expectedType}:this.key}};function kn(e){return new oe(e)}function qn(e){return e}var he=(e,t)=>{let o=[],s=[],r=new Set;return t?.forEach(n=>{let a=typeof n=="string"?n:n.key,i=typeof n=="object"&&"expectedValue"in n?n.expectedValue:void 0,f=typeof n=="object"&&"expectedType"in n?n.expectedType:void 0,u=typeof n=="object"&&"description"in n?n.description:void 0;r.add(a);let d=e[a],D=d!==void 0,S;if(!D)S="required_missing";else if(i){let W=!1;i==="sk_*"?W=d.startsWith("sk_"):i==="production or development"?W=d==="production"||d==="development":W=d===i,S=W?"required_present":"required_wrong_value"}else f&&Q(d).toLowerCase()!==f.toLowerCase()?S="required_wrong_type":S="required_present";o.push({key:a,value:d,expectedValue:i,expectedType:f,description:u,status:S,category:"required"})}),Object.entries(e).forEach(([n,a])=>{r.has(n)||s.push({key:n,value:a,status:"optional_present",category:"optional"})}),o.sort((n,a)=>{let i={required_missing:0,required_wrong_value:1,required_wrong_type:2,required_present:3,optional_present:4};return i[n.status]!==i[a.status]?i[n.status]-i[a.status]:n.key.localeCompare(a.key)}),s.sort((n,a)=>n.key.localeCompare(a.key)),{requiredVars:o,optionalVars:s}},xe=(e,t,o)=>{let s=Object.keys(o).length,r=e.length,n=e.filter(d=>d.status==="required_missing").length,a=e.filter(d=>d.status==="required_wrong_value").length,i=e.filter(d=>d.status==="required_wrong_type").length,f=e.filter(d=>d.status==="required_present").length,u=t.length;return{totalCount:s,requiredCount:r,missingCount:n,wrongValueCount:a,wrongTypeCount:i,presentRequiredCount:f,optionalCount:u}};import{useCallback as Ft,useState as jt}from"react";import{CompactRow as Bt,TypeBadge as re,buoyColors as M,night as ie,monoFont as se}from"@buoy-gg/shared-ui/web";import{Fragment as zt,jsx as E,jsxs as L}from"react/jsx-runtime";var Nt=(e,t)=>{switch(e){case"required_present":return{label:"Valid",color:M.success,sublabel:"Required"};case"required_missing":return{label:"Missing",color:M.error,sublabel:"Required"};case"required_wrong_value":return{label:"Wrong",color:M.warning,sublabel:"Invalid value"};case"required_wrong_type":return{label:"Type Error",color:M.info,sublabel:"Wrong type"};case"optional_present":return{label:"Set",color:M.textSecondary,sublabel:"Optional"}}};var $t=e=>e==null?"undefined":typeof e=="string"?e:String(e);function we({envVar:e,isExpanded:t,onPress:o}){let s=Nt(e.status,e.expectedType),r=e.value!==void 0&&e.value!==null,a=e.key.split("_").map(u=>u.toLowerCase()).join(" \u203A "),i=`buoy-env-row-${e.key}`,f=L(p,{style:m.expandedContainer,children:[L(p,{style:m.expandedRow,children:[E(y,{style:m.expandedLabel,children:"Value:"}),E(y,{style:m.expandedValue,numberOfLines:3,testID:`${i}-value`,children:$t(e.value)||"undefined"})]}),e.status==="required_wrong_type"&&e.expectedType&&L(zt,{children:[L(p,{style:m.expandedRow,children:[E(y,{style:m.expandedLabel,children:"Type:"}),E(re,{type:Q(e.value),testID:`${i}-actual-type`})]}),L(p,{style:m.expandedRow,children:[E(y,{style:m.expandedLabel,children:"Expected:"}),E(re,{type:e.expectedType,testID:`${i}-expected-type`})]})]}),e.status==="required_wrong_value"&&e.expectedValue&&L(p,{style:m.expandedRow,children:[E(y,{style:m.expandedLabel,children:"Expected:"}),E(y,{style:m.expandedExpected,testID:`${i}-expected-value`,children:String(e.expectedValue)})]}),e.description&&L(p,{style:m.expandedRow,children:[E(y,{style:m.expandedLabel,children:"Info:"}),E(y,{style:m.expandedDescription,testID:`${i}-description`,children:e.description})]})]});return E(Bt,{statusDotColor:s.color,statusLabel:s.label,statusSublabel:s.sublabel,primaryText:a,secondaryText:void 0,expandedContent:f,isExpanded:t,expandedGlowColor:s.color,customBadge:e.expectedType?E(re,{type:e.expectedType,testID:`${i}-type-badge`}):void 0,showChevron:!0,onPress:o?()=>o(e):void 0,testID:i,statusTestID:`${i}-status`,statusSublabelTestID:`${i}-category`,accessibilityLabel:`${e.key}, ${s.label}, ${s.sublabel}`})}var m=C.create({expandedContainer:{gap:6},expandedRow:{flexDirection:"row",alignItems:"center",gap:8},expandedLabel:{fontSize:10,color:ie.color.textTertiary,fontWeight:"600",minWidth:60,fontFamily:se},expandedValue:{fontSize:11,color:ie.color.textSecondary,fontFamily:se,flex:1},expandedExpected:{fontSize:11,color:M.warning,fontFamily:se,flex:1},expandedDescription:{fontSize:11,color:ie.color.textSecondary,flex:1}});import{SectionHeader as O,night as $,monoFont as Kt}from"@buoy-gg/shared-ui/web";import{jsx as q,jsxs as Y}from"react/jsx-runtime";function Te({title:e,count:t,vars:o,emptyMessage:s}){let[r,n]=jt(null),a=Ft(i=>{n(f=>f===i.key?null:i.key)},[]);return o.length===0&&e==="Required Variables"?Y(p,{style:N.sectionContainer,children:[Y(O,{children:[q(O.Title,{children:e}),q(O.Badge,{count:0,color:$.color.accent})]}),q(p,{style:N.emptySection,children:q(y,{style:N.emptySectionText,children:s})})]}):o.length===0?null:Y(p,{style:N.sectionContainer,children:[e!==""&&Y(O,{children:[q(O.Title,{children:e}),q(O.Badge,{count:t,color:$.color.accent})]}),q(p,{style:N.sectionContent,children:o.map(i=>q(we,{envVar:i,isExpanded:r===i.key,onPress:a},i.key))})]})}var N=C.create({sectionContainer:{gap:8},sectionContent:{},emptySection:{padding:20,backgroundColor:$.color.accent+"08",borderRadius:8,borderWidth:1,borderColor:$.color.accent+"20",alignItems:"center"},emptySectionText:{color:$.color.accent,fontSize:11,textAlign:"center",fontFamily:Kt,opacity:.8,letterSpacing:.5}});import{jsx as v,jsxs as j}from"react/jsx-runtime";function ee({visible:e,onClose:t,requiredEnvVars:o,onBack:s,onMinimize:r,enableSharedModalDimensions:n=!1,inline:a=!1}){let[i,f]=ae("all"),[u,d]=ae(!1),[D,S]=ae(""),W=en(null),ke=Zt(V=>{},[]);Se(()=>{u&&W.current&&W.current.focus()},[u]),Se(()=>{S(""),d(!1)},[i]);let le=ve(),G=F(()=>{let V={};return le.forEach(({key:h,data:x})=>{x!=null&&(V[h]=typeof x=="string"?x:Jt(x))}),V},[le]),{requiredVars:U,optionalVars:P}=F(()=>he(G,o),[G,o]),J=F(()=>o===void 0?{totalCount:0,requiredCount:0,optionalCount:0,presentRequiredCount:0,missingCount:0,wrongValueCount:0,wrongTypeCount:0}:xe(U,P,G),[o,U,P,G]),H=F(()=>[...U,...P].sort((h,x)=>{let de={required_missing:1,required_wrong_type:2,required_wrong_value:3,required_present:4,optional_present:5};return(de[h.status]||999)-(de[x.status]||999)}),[U,P]),te=F(()=>{let V=[];switch(i){case"all":V=H;break;case"missing":V=H.filter(h=>h.status==="required_missing");break;case"issues":V=H.filter(h=>h.status==="required_wrong_type"||h.status==="required_wrong_value");break}if(D){let h=D.toLowerCase();V=V.filter(x=>x.key.toLowerCase().includes(h)||x.description?.toLowerCase().includes(h)||typeof x.value=="string"&&x.value.toLowerCase().includes(h))}return V},[H,P,i,D]),_=J.requiredCount>0?Math.round(J.presentRequiredCount/J.requiredCount*100):100,qe=_===100?"HEALTHY":_>=75?"WARNING":_>=50?"ERROR":"CRITICAL",De=_===100?K.success:_>=75?K.warning:_>=50?K.error:K.error;if(!e)return null;let We=n?Ee.modal.root():Ee.env.modal(),ce=j(z,{children:[s&&v(z.Navigation,{onBack:s}),v(z.Content,{title:u?"":"Environment Variables",noMargin:u,children:u&&v(z.Search,{value:D,onChangeText:S,onCancel:()=>{d(!1),S("")},placeholder:"Search env keys...",accessibilityLabel:"Search env keys",testID:"buoy-env-search",containerTestID:"buoy-env-search-field",clearTestID:"buoy-env-search-clear"})}),v(z.Actions,{children:!u&&v(Ut,{onPress:()=>d(!0),testID:"buoy-env-search-open",accessibilityLabel:"Search env keys"})})]}),ue=j(ne,{style:I.scrollContainer,contentContainerStyle:I.contentContainer,showsVerticalScrollIndicator:!1,testID:"buoy-env-scroll",children:[v(be,{stats:J,healthPercentage:_,healthStatus:qe,healthColor:De,activeFilter:i,onFilterChange:f}),te.length>0?j(p,{style:I.varsSection,children:[j(p,{style:I.sectionHeader,children:[v(y,{style:I.sectionTitle,testID:"buoy-env-section-title",children:i==="all"?"ALL VARIABLES":i==="missing"?"MISSING VARIABLES":"ISSUES TO FIX"}),v(p,{style:I.countBadge,children:v(y,{style:I.countText,testID:"buoy-env-section-count",children:te.length})})]}),v(Te,{title:"",count:0,vars:te,emptyMessage:""})]}):v(Qt,{testID:"buoy-env-empty",...Yt({subject:"variables",verb:"declared",search:D,total:H.length,waiting:{otto:"keys",title:"No variables",message:`No ${i==="all"?"":i} variables found`}})})]});return a?j(p,{style:I.inlineRoot,children:[v(p,{style:I.inlineHeader,...Xt,children:ce}),ue]}):v(Gt,{visible:e,onClose:t,onMinimize:r,persistenceKey:We,header:{customContent:ce,showToggleButton:!0},onModeChange:ke,enablePersistence:!0,initialMode:"bottomSheet",enableGlitchEffects:!0,styles:{},children:ue})}function tn({requiredEnvVars:e}){return v(ee,{inline:!0,visible:!0,requiredEnvVars:e,onClose:()=>{}})}var I=C.create({inlineRoot:{flex:1,minHeight:0,backgroundColor:"transparent"},inlineHeader:{paddingHorizontal:12,paddingVertical:8,borderBottomWidth:1,borderBottomColor:K.border,backgroundColor:"transparent"},scrollContainer:{flex:1,backgroundColor:"transparent"},contentContainer:{padding:8,paddingBottom:24},varsSection:{marginTop:16},sectionHeader:{flexDirection:"row",justifyContent:"space-between",alignItems:"center",marginBottom:8,paddingHorizontal:8},sectionTitle:{fontSize:10,fontWeight:"700",color:Z.color.textTertiary,letterSpacing:1.2,fontFamily:Ve},countBadge:{backgroundColor:Z.color.accent+"15",paddingHorizontal:8,paddingVertical:2,borderRadius:9999,borderWidth:1,borderColor:Z.color.accent+"40"},countText:{fontSize:10,fontWeight:"500",color:Z.color.accent,fontFamily:Ve}});function nn(){let e={};for(let[t,o]of Object.entries(X()??(typeof process>"u"?{}:process.env)))typeof o=="string"&&(e[t]=o);return e}var Ce=[];function Ie(e){Ce=e}function on(e=[]){return{version:1,getSnapshot:()=>({env:nn(),requiredEnvVars:e.length>0?e:Ce}),subscribe:()=>()=>{}}}import{createToolFactory as sn,defineToolPreset as an}from"@buoy-gg/shared-ui/web";import{jsx as cn}from"react/jsx-runtime";var Re=an({id:"env",name:"ENV",description:"Environment variables debugger",slot:"both",icon:({size:e})=>cn(rn,{size:e}),component:ee,props:{requiredEnvVars:[],enableSharedModalDimensions:!0}}),ln=sn(Re,e=>(Ie(e.requiredEnvVars||[]),{requiredEnvVars:e.requiredEnvVars||[],enableSharedModalDimensions:e.enableSharedModalDimensions??!0}));export{tn as EnvToolView,ee as EnvVarsModal,xe as calculateStats,on as createEnvSyncAdapter,ln as createEnvTool,qn as createEnvVarConfig,Re as envToolPreset,kn as envVar,Q as getEnvVarType,he as processEnvVars,Ht as setRemoteEnv};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@buoy-gg/env",
-  "version": "7.0.39",
+  "version": "7.0.41",
   "description": "Environment variable inspector for React Native with runtime-visible values, required-variable checks, and type validation.",
   "main": "lib/commonjs/index.js",
   "module": "lib/module/index.js",
@@ -10,28 +10,38 @@
   "exports": {
     ".": {
       "react-native": "./lib/module/index.js",
+      "browser": {
+        "types": "./lib/typescript/index.d.ts",
+        "default": "./lib/web/index.mjs"
+      },
       "import": {
-        "default": "./lib/module/index.js",
-        "types": "./lib/typescript/index.d.ts"
+        "types": "./lib/typescript/index.d.ts",
+        "default": "./lib/module/index.js"
       },
       "require": {
-        "default": "./lib/commonjs/index.js",
-        "types": "./lib/typescript/index.d.ts"
+        "types": "./lib/typescript/index.d.ts",
+        "default": "./lib/commonjs/index.js"
       }
     },
-    "./package.json": "./package.json"
+    "./package.json": "./package.json",
+    "./web": {
+      "types": "./lib/typescript/index.d.ts",
+      "default": "./lib/web/index.mjs"
+    }
   },
   "files": [
     "lib"
   ],
   "sideEffects": false,
   "dependencies": {
-    "@buoy-gg/floating-tools-core": "^7.0.39",
-    "@buoy-gg/shared-ui": "^7.0.39"
+    "@buoy-gg/shared-ui": "^7.0.41",
+    "@buoy-gg/floating-tools-core": "^7.0.41"
   },
   "peerDependencies": {
     "react": "*",
-    "react-native": "*"
+    "react-native": "*",
+    "react-native-web": "^0.21.0",
+    "react-dom": ">=18"
   },
   "react-native-builder-bob": {
     "source": "src",
@@ -86,10 +96,22 @@
     "config",
     "app-env"
   ],
+  "peerDependenciesMeta": {
+    "react-native": {
+      "optional": true
+    },
+    "react-native-web": {
+      "optional": true
+    },
+    "react-dom": {
+      "optional": true
+    }
+  },
   "scripts": {
-    "build": "bob build",
+    "build": "bob build && pnpm run build:web",
     "typecheck": "tsc --noEmit",
     "clean": "rimraf lib",
-    "test": "pnpm run typecheck"
+    "test": "pnpm run typecheck",
+    "build:web": "node ../../scripts/build-web.mjs env"
   }
 }