@buoy-gg/shared-ui 7.0.41 → 7.0.42

package/lib/commonjs/dataViewer/treeActions.js

@@ -1,168 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.breadcrumb = breadcrumb;
-exports.treeActionMap = treeActionMap;
-exports.treeActionsFor = treeActionsFor;
-exports.typeLabel = typeLabel;
-var _jsonOps = require("./jsonOps.js");
-/**
- * What you can do to the node a data explorer has selected — as data, not UI.
- *
- * Two surfaces render this list and they look nothing alike: the dashboard's
- * footer bar is a row of small chips beside a cursor, the phone's full-screen
- * editor is a grid of thumb-sized tiles. Deriving both from one function is the
- * point — "can this item move up" is a property of the DOCUMENT, and having two
- * components each answer it from their own reading of `root` is how the two
- * surfaces quietly start disagreeing about what's legal.
- *
- * So this module answers it once and hands back a list. The renderers decide
- * what a disabled action looks like and which icon it wears; they never decide
- * whether it applies.
- */
-
-/** The node a data explorer currently has selected. */
-
-/** The node's type, as a badge shows it. */
-function typeLabel(value) {
-  if (value === null) return "null";
-  if (Array.isArray(value)) return "array";
-  if ((0, _jsonOps.isRebuildableObject)(value)) return "object";
-  return typeof value;
-}
-
-/** `a › b › 2` — reads as a location, which a bare index like `2` does not. */
-function breadcrumb(path) {
-  return path.length === 0 ? "root" : path.join(" › ");
-}
-
-/**
- * Index the list by id, for renderers that lay the six out in their own order.
- *
- * The bar and the dock genuinely disagree here — the bar puts the two move
- * arrows together in the middle because they're icon-only and read as a pair,
- * the dock follows the mockup's reading order. Neither ordering belongs in the
- * capability list, so both look up what they need.
- */
-function treeActionMap(actions) {
-  const map = {};
-  for (const action of actions) map[action.id] = action;
-  return map;
-}
-
-/** A key that doesn't collide, for "add" on an object. */
-function newKeyFor(container) {
-  if (!("newKey" in container)) return "newKey";
-  let n = 2;
-  while (`newKey ${n}` in container) n++;
-  return `newKey ${n}`;
-}
-
-/**
- * The six things a selection can do, ALWAYS in this order and always all six.
- *
- * Returning the inapplicable ones as `enabled: false` rather than omitting them
- * is deliberate and is why this returns a fixed-length list: a renderer that
- * drops entries reflows every time the selection moves, so stepping from item 1
- * to item 0 would slide the remaining controls sideways under a finger already
- * on its way down. Stable position also means the same action is always in the
- * same place, which is most of what makes a grid of six learnable.
- */
-function treeActionsFor(root, selection, options = {}) {
-  const path = selection?.path ?? [];
-  const value = selection?.value;
-  const has = selection != null;
-  const isRoot = path.length === 0;
-  const removeLocked = options.rootEntriesLocked === true && path.length === 1;
-  const parent = has && !isRoot ? (0, _jsonOps.getAtPath)(root, path.slice(0, -1)) : undefined;
-  const parentIsArray = Array.isArray(parent);
-  const index = parentIsArray ? Number(path[path.length - 1]) : -1;
-  const isArray = Array.isArray(value);
-  const isObject = (0, _jsonOps.isRebuildableObject)(value);
-  const isContainer = (0, _jsonOps.isEditableContainer)(value);
-  const canEditValue = has && (options.containersEditable === true || !isContainer);
-
-  // One "+" slot whose meaning follows the container type, rather than two
-  // mutually-exclusive buttons of which one is always dead.
-  const addedKey = isObject ? newKeyFor(value) : "";
-  const add = isObject ? {
-    id: "add",
-    label: "Add key",
-    enabled: true,
-    op: {
-      kind: "addKey",
-      path,
-      key: addedKey,
-      value: (0, _jsonOps.suggestedNewValue)(value)
-    },
-    selectAfter: [...path, addedKey]
-  } : {
-    id: "add",
-    label: "Append",
-    enabled: isArray,
-    op: isArray ? {
-      kind: "append",
-      path,
-      value: (0, _jsonOps.suggestedNewValue)(value)
-    } : null,
-    selectAfter: isArray ? [...path, String(value.length)] : undefined
-  };
-  return [
-  // A boolean has exactly two states, so there is nothing to ask and nothing
-  // to type — an editor for it would be a screen whose only job is to offer
-  // the value you didn't pick. It flips in place instead.
-  typeof value === "boolean" ? {
-    id: "editValue",
-    label: "Toggle",
-    enabled: true,
-    op: {
-      kind: "replace",
-      path,
-      value: !value
-    }
-  } : {
-    id: "editValue",
-    label: "Edit value",
-    enabled: canEditValue,
-    op: null
-  }, add, {
-    // `duplicate` handles object keys too (it mints a "<key> copy" in place),
-    // so this applies to any entry that has a parent.
-    id: "duplicate",
-    label: "Duplicate",
-    enabled: has && !isRoot,
-    op: has && !isRoot ? {
-      kind: "duplicate",
-      path
-    } : null
-  }, {
-    id: "moveUp",
-    label: "Move up",
-    enabled: has && parentIsArray && index > 0,
-    op: has && parentIsArray && index > 0 ? {
-      kind: "move",
-      path,
-      toIndex: index - 1
-    } : null
-  }, {
-    id: "moveDown",
-    label: "Move down",
-    enabled: has && parentIsArray && index > -1 && index < parent.length - 1,
-    op: has && parentIsArray && index > -1 && index < parent.length - 1 ? {
-      kind: "move",
-      path,
-      toIndex: index + 1
-    } : null
-  }, {
-    id: "remove",
-    label: "Remove",
-    danger: true,
-    enabled: has && !isRoot && !removeLocked,
-    op: has && !isRoot && !removeLocked ? {
-      kind: "remove",
-      path
-    } : null
-  }];
-}
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.breadcrumb=breadcrumb;exports.treeActionMap=treeActionMap;exports.treeActionsFor=treeActionsFor;exports.typeLabel=typeLabel;var _jsonOps=require("./jsonOps.js");function typeLabel(e){if(e===null)return"null";if(Array.isArray(e))return"array";if((0,_jsonOps.isRebuildableObject)(e))return"object";return typeof e}function breadcrumb(e){return e.length===0?"root":e.join(" \u203A ")}function treeActionMap(e){const t={};for(const a of e)t[a.id]=a;return t}function newKeyFor(e){if(!("newKey"in e))return"newKey";let t=2;while(`newKey ${t}`in e)t++;return`newKey ${t}`}function treeActionsFor(e,t,a={}){const n=t?.path??[];const l=t?.value;const r=t!=null;const d=n.length===0;const c=a.rootEntriesLocked===true&&n.length===1;const u=r&&!d?(0,_jsonOps.getAtPath)(e,n.slice(0,-1)):void 0;const i=Array.isArray(u);const o=i?Number(n[n.length-1]):-1;const s=Array.isArray(l);const b=(0,_jsonOps.isRebuildableObject)(l);const y=(0,_jsonOps.isEditableContainer)(l);const f=r&&(a.containersEditable===true||!y);const p=b?newKeyFor(l):"";const A=b?{id:"add",label:"Add key",enabled:true,op:{kind:"addKey",path:n,key:p,value:(0,_jsonOps.suggestedNewValue)(l)},selectAfter:[...n,p]}:{id:"add",label:"Append",enabled:s,op:s?{kind:"append",path:n,value:(0,_jsonOps.suggestedNewValue)(l)}:null,selectAfter:s?[...n,String(l.length)]:void 0};return[typeof l==="boolean"?{id:"editValue",label:"Toggle",enabled:true,op:{kind:"replace",path:n,value:!l}}:{id:"editValue",label:"Edit value",enabled:f,op:null},A,{id:"duplicate",label:"Duplicate",enabled:r&&!d,op:r&&!d?{kind:"duplicate",path:n}:null},{id:"moveUp",label:"Move up",enabled:r&&i&&o>0,op:r&&i&&o>0?{kind:"move",path:n,toIndex:o-1}:null},{id:"moveDown",label:"Move down",enabled:r&&i&&o>-1&&o<u.length-1,op:r&&i&&o>-1&&o<u.length-1?{kind:"move",path:n,toIndex:o+1}:null},{id:"remove",label:"Remove",danger:true,enabled:r&&!d&&!c,op:r&&!d&&!c?{kind:"remove",path:n}:null}]}

package/lib/commonjs/dataViewer/useTreeDraft.js

@@ -1,125 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useTreeDraft = useTreeDraft;
-var _react = require("react");
-var _jsonOps = require("./jsonOps.js");
-/**
- * A local draft of a tree value, edited in place and written ONCE.
- *
- * Applying each tree op straight to the owning document was the obvious first
- * cut and it behaves badly for two compounding reasons:
- *
- * 1. **Every op is a round trip.** The write lands, the owner emits an event,
- *    a snapshot comes back, and the browser re-reads everything — so a six-tap
- *    reorder is six writes and six full refreshes. The tree rebuilds under the
- *    user mid-gesture.
- * 2. **The highlight and the value fall out of step.** Selection is local and
- *    moves instantly; the value it points at only catches up when the round
- *    trip completes, so for a beat the highlight sits on the old contents.
- *
- * Optimistic updates — the React Query pattern of rendering the expected result
- * and reconciling later — fix (2) but not (1): they still write per change.
- * Buffering fixes both, and it's what every editor that owns a document does
- * (a form's dirty state, an IDE's unsaved buffer, JSON Editor's in-memory doc
- * with an explicit save).
- *
- * The trade is that the buffer can go stale if the owner writes the same
- * document while you're editing. That's the same last-write-wins a text editor
- * has, and `isDirty` at least makes it visible that you're holding unsaved
- * changes.
- *
- * Grew up as the Storage tool's key editor; hoisted here so the Zustand store
- * editor is the same editor rather than a drifting copy. The save contract
- * takes the VALUE — a storage host stringifies it, a zustand host diffs it
- * into a merge partial.
- */
-
-/**
- * @param liveValue  the value as its owner currently holds it (already parsed)
- * @param save       persists the draft VALUE; rejecting keeps edit mode open
- */
-function useTreeDraft(liveValue, save) {
-  const [draft, setDraft] = (0, _react.useState)(undefined);
-  const [isEditing, setIsEditing] = (0, _react.useState)(false);
-  const [isSaving, setIsSaving] = (0, _react.useState)(false);
-  const [error, setError] = (0, _react.useState)(null);
-  const [selectPath, setSelectPath] = (0, _react.useState)();
-  /**
-   * The value as it was when editing began. Compared against for dirtiness
-   * rather than against `liveValue`, which can move underneath us if the owner
-   * writes the same document — that would otherwise flip a clean draft to
-   * dirty.
-   */
-  const [baseline, setBaseline] = (0, _react.useState)("");
-  const value = isEditing && draft !== undefined ? draft : liveValue;
-  const isDirty = isEditing && JSON.stringify(draft) !== baseline;
-  const begin = (0, _react.useCallback)(() => {
-    setDraft(liveValue);
-    setBaseline(JSON.stringify(liveValue));
-    setSelectPath(undefined);
-    setError(null);
-    setIsEditing(true);
-  }, [liveValue]);
-  const apply = (0, _react.useCallback)(op => {
-    // Purely local — this is the whole point. No write, so no event, no
-    // snapshot, no refresh, and the tree re-renders from state synchronously.
-    setDraft(prev => (0, _jsonOps.applyJsonOp)(prev, op));
-    const next = (0, _jsonOps.selectionPathAfterOp)(op);
-    if (next !== undefined) setSelectPath(next);
-  }, []);
-  const selectAt = (0, _react.useCallback)(path => {
-    setSelectPath(path);
-  }, []);
-
-  /** Leave edit mode entirely. Only correct on the way out (after a write). */
-  const reset = (0, _react.useCallback)(() => {
-    setIsEditing(false);
-    setDraft(undefined);
-    setSelectPath(undefined);
-    setError(null);
-  }, []);
-
-  /** Re-seed the draft from what's stored, staying in edit mode. */
-  const discard = (0, _react.useCallback)(() => {
-    setDraft(liveValue);
-    setBaseline(JSON.stringify(liveValue));
-    setSelectPath(undefined);
-    setError(null);
-    setIsEditing(true);
-  }, [liveValue]);
-  const commit = (0, _react.useCallback)(async () => {
-    if (!isDirty || !save) {
-      reset();
-      return true;
-    }
-    setIsSaving(true);
-    setError(null);
-    try {
-      await save(draft);
-      reset();
-      return true;
-    } catch (e) {
-      // Stay in edit mode so the work isn't lost to a failed write.
-      setError(e instanceof Error ? e.message : String(e));
-      return false;
-    } finally {
-      setIsSaving(false);
-    }
-  }, [draft, isDirty, reset, save]);
-  return {
-    isEditing,
-    value,
-    isDirty,
-    isSaving,
-    error,
-    selectPath,
-    begin,
-    apply,
-    selectAt,
-    commit,
-    discard
-  };
-}
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.useTreeDraft=useTreeDraft;var _react=require("react");var _jsonOps=require("./jsonOps.js");function useTreeDraft(t,u){const[s,a]=(0,_react.useState)(void 0);const[c,i]=(0,_react.useState)(false);const[g,f]=(0,_react.useState)(false);const[p,n]=(0,_react.useState)(null);const[y,r]=(0,_react.useState)();const[b,d]=(0,_react.useState)("");const O=c&&s!==void 0?s:t;const l=c&&JSON.stringify(s)!==b;const k=(0,_react.useCallback)(()=>{a(t);d(JSON.stringify(t));r(void 0);n(null);i(true)},[t]);const C=(0,_react.useCallback)(e=>{a(E=>(0,_jsonOps.applyJsonOp)(E,e));const S=(0,_jsonOps.selectionPathAfterOp)(e);if(S!==void 0)r(S)},[]);const h=(0,_react.useCallback)(e=>{r(e)},[]);const o=(0,_react.useCallback)(()=>{i(false);a(void 0);r(void 0);n(null)},[]);const j=(0,_react.useCallback)(()=>{a(t);d(JSON.stringify(t));r(void 0);n(null);i(true)},[t]);const D=(0,_react.useCallback)(async()=>{if(!l||!u){o();return true}f(true);n(null);try{await u(s);o();return true}catch(e){n(e instanceof Error?e.message:String(e));return false}finally{f(false)}},[s,l,o,u]);return{isEditing:c,value:O,isDirty:l,isSaving:g,error:p,selectPath:y,begin:k,apply:C,selectAt:h,commit:D,discard:j}}

package/lib/commonjs/dataViewer/useTreeEditor.js

@@ -1,105 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useTreeEditor = useTreeEditor;
-var _react = require("react");
-var _jsonOps = require("./jsonOps.js");
-var _useTreeDraft = require("./useTreeDraft.js");
-/**
- * Everything editing a tree document involves, minus how it looks.
- *
- * The phone and the dashboard run the same editor: one buffered draft, one
- * write on save, a selection the structural actions operate on, a modal for
- * typing a value, and a guard so closing can't silently drop unsaved work.
- * What differs is presentation — thumb-sized tiles under a full screen versus
- * chips docked in a panel — which is a rendering concern and nothing more.
- *
- * Keeping the rules here means the surfaces (and the tools — storage keys and
- * zustand stores run this same hook) can't drift on the things that would
- * actually hurt: whether a boolean opens an editor, whether a failed write
- * closes the editor anyway, what "dirty" means.
- */
-
-function useTreeEditor({
-  value,
-  save,
-  onClose,
-  confirmDiscard
-}) {
-  const draft = (0, _useTreeDraft.useTreeDraft)(value, save);
-  const [selection, setSelection] = (0, _react.useState)(null);
-  const [valuePath, setValuePath] = (0, _react.useState)(null);
-  const {
-    begin
-  } = draft;
-  (0, _react.useEffect)(() => {
-    begin();
-    // Seed the draft ONCE, when the editor opens. `begin` closes over the live
-    // value, whose identity changes every time the list refreshes underneath
-    // us (a parsed JSON string is a new object each pass), so re-running would
-    // reset the draft mid-edit and discard the user's work.
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-
-  /**
-   * "Change this node". For a boolean that's a flip rather than a modal — the
-   * same rule `treeActionsFor` applies to the action controls, so the gesture
-   * and the button can't mean different things.
-   */
-  const openValueEditor = (0, _react.useCallback)(path => {
-    const current = (0, _jsonOps.getAtPath)(draft.value, path);
-    if (typeof current === "boolean") {
-      draft.apply({
-        kind: "replace",
-        path,
-        value: !current
-      });
-      return;
-    }
-    setValuePath(path);
-  }, [draft]);
-  const applyValue = (0, _react.useCallback)(next => {
-    draft.apply({
-      kind: "replace",
-      path: valuePath ?? [],
-      value: next
-    });
-    setValuePath(null);
-  }, [draft, valuePath]);
-
-  // Only leave once the write actually landed — `commit` resolves false and
-  // keeps the draft on screen when the owner refuses it, and closing anyway
-  // would throw the work away while showing an error nobody ever sees.
-  const saveAndClose = (0, _react.useCallback)(() => {
-    void draft.commit().then(saved => saved && onClose());
-  }, [draft, onClose]);
-  const requestClose = (0, _react.useCallback)(() => {
-    if (!draft.isDirty) {
-      onClose();
-      return;
-    }
-    // The draft is the only copy of this work, so closing over it silently is
-    // the one way this editor can lose something the user can't get back.
-    confirmDiscard({
-      save: saveAndClose,
-      discard: () => {
-        draft.discard();
-        onClose();
-      }
-    });
-  }, [confirmDiscard, draft, onClose, saveAndClose]);
-  return {
-    draft,
-    selection,
-    setSelection,
-    valuePath,
-    openValueEditor,
-    closeValueEditor: () => setValuePath(null),
-    applyValue,
-    openRawEditor: () => setValuePath([]),
-    requestClose,
-    saveAndClose
-  };
-}
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.useTreeEditor=useTreeEditor;var _react=require("react");var _jsonOps=require("./jsonOps.js");var _useTreeDraft=require("./useTreeDraft.js");function useTreeEditor({value:c,save:o,onClose:r,confirmDiscard:l}){const e=(0,_useTreeDraft.useTreeDraft)(c,o);const[i,d]=(0,_react.useState)(null);const[s,a]=(0,_react.useState)(null);const{begin:p}=e;(0,_react.useEffect)(()=>{p()},[]);const v=(0,_react.useCallback)(t=>{const n=(0,_jsonOps.getAtPath)(e.value,t);if(typeof n==="boolean"){e.apply({kind:"replace",path:t,value:!n});return}a(t)},[e]);const f=(0,_react.useCallback)(t=>{e.apply({kind:"replace",path:s??[],value:t});a(null)},[e,s]);const u=(0,_react.useCallback)(()=>{void e.commit().then(t=>t&&r())},[e,r]);const b=(0,_react.useCallback)(()=>{if(!e.isDirty){r();return}l({save:u,discard:()=>{e.discard();r()}})},[l,e,r,u]);return{draft:e,selection:i,setSelection:d,valuePath:s,openValueEditor:v,closeValueEditor:()=>a(null),applyValue:f,openRawEditor:()=>a([]),requestClose:b,saveAndClose:u}}

package/lib/commonjs/env/EnvironmentIndicator.js

@@ -1,129 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.EnvironmentIndicator = EnvironmentIndicator;
-var _reactNative = require("react-native");
-var _index = require("../icons/index.js");
-var _gameUIColors = require("../ui/gameUI/constants/gameUIColors.js");
-var _types = require("../types/types.js");
-var _jsxRuntime = require("react/jsx-runtime");
-function getEnvironmentConfig(environment) {
-  const normalized = (0, _types.normalizeEnvironment)(environment);
-  switch (normalized) {
-    case "local":
-      return {
-        label: "LOCAL",
-        backgroundColor: _gameUIColors.gameUIColors.info,
-        icon: _index.FlaskConical,
-        isLocal: true
-      };
-    case "dev":
-      return {
-        label: "DEV",
-        backgroundColor: _gameUIColors.gameUIColors.warning,
-        icon: _index.FlaskConical,
-        isLocal: false
-      };
-    case "qa":
-      return {
-        label: "QA",
-        backgroundColor: _gameUIColors.gameUIColors.optional,
-        icon: _index.Bug,
-        isLocal: false
-      };
-    case "staging":
-      return {
-        label: "STAGING",
-        backgroundColor: _gameUIColors.gameUIColors.success,
-        icon: _index.Zap,
-        isLocal: false
-      };
-    case "prod":
-      return {
-        label: "PROD",
-        backgroundColor: _gameUIColors.gameUIColors.error,
-        icon: _index.TestTube2,
-        isLocal: false
-      };
-    default:
-      return {
-        label: "LOCAL",
-        backgroundColor: _gameUIColors.gameUIColors.info,
-        icon: _index.FlaskConical,
-        isLocal: true
-      };
-  }
-}
-function EnvironmentIndicator({
-  environment,
-  onLayout,
-  interactive = false,
-  onPress
-}) {
-  const envConfig = getEnvironmentConfig(environment);
-  const content = /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-    onLayout: onLayout,
-    style: {
-      flexDirection: "row",
-      alignItems: "center",
-      paddingVertical: 6,
-      paddingLeft: 8,
-      paddingRight: interactive ? 4 : 8,
-      flexShrink: 0
-    },
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-      style: {
-        width: 8,
-        height: 8,
-        borderRadius: 4,
-        backgroundColor: envConfig.backgroundColor,
-        marginRight: 6,
-        shadowColor: envConfig.backgroundColor,
-        shadowOffset: {
-          width: 0,
-          height: 0
-        },
-        shadowOpacity: 0.6,
-        shadowRadius: 4,
-        elevation: 2
-      }
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-      style: {
-        fontSize: 11,
-        fontWeight: "600",
-        // No fontFamily on purpose: the platform UI font (SF Pro / Roboto)
-        // is what this badge is meant to look like, and it is what the DOM
-        // twin in EnvironmentIndicator.web.tsx has always rendered. This
-        // used to name "Poppins-SemiBold" — a family no app, package or
-        // example in the repo has ever loaded, so it resolved nowhere:
-        // silently the system font on device, and the browser's default
-        // SERIF under react-native-web (the docs demo).
-        color: _gameUIColors.gameUIColors.primaryLight,
-        letterSpacing: 0.5
-      },
-      children: envConfig.label
-    }), interactive && /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ChevronDown, {
-      size: 12,
-      color: _gameUIColors.gameUIColors.muted,
-      style: {
-        marginLeft: 2
-      }
-    })]
-  });
-  if (interactive && onPress) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
-      onPress: onPress,
-      style: ({
-        pressed
-      }) => ({
-        opacity: pressed ? 0.7 : 1
-      }),
-      accessibilityRole: "button",
-      accessibilityLabel: `Current environment: ${envConfig.label}. Tap to switch environment.`,
-      children: content
-    });
-  }
-  return content;
-}
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.EnvironmentIndicator=EnvironmentIndicator;var _reactNative=require("react-native");var _index=require("../icons/index.js");var _gameUIColors=require("../ui/gameUI/constants/gameUIColors.js");var _types=require("../types/types.js");var _jsxRuntime=require("react/jsx-runtime");function getEnvironmentConfig(o){const r=(0,_types.normalizeEnvironment)(o);switch(r){case"local":return{label:"LOCAL",backgroundColor:_gameUIColors.gameUIColors.info,icon:_index.FlaskConical,isLocal:true};case"dev":return{label:"DEV",backgroundColor:_gameUIColors.gameUIColors.warning,icon:_index.FlaskConical,isLocal:false};case"qa":return{label:"QA",backgroundColor:_gameUIColors.gameUIColors.optional,icon:_index.Bug,isLocal:false};case"staging":return{label:"STAGING",backgroundColor:_gameUIColors.gameUIColors.success,icon:_index.Zap,isLocal:false};case"prod":return{label:"PROD",backgroundColor:_gameUIColors.gameUIColors.error,icon:_index.TestTube2,isLocal:false};default:return{label:"LOCAL",backgroundColor:_gameUIColors.gameUIColors.info,icon:_index.FlaskConical,isLocal:true}}}function EnvironmentIndicator({environment:o,onLayout:r,interactive:a=false,onPress:n}){const e=getEnvironmentConfig(o);const i=(0,_jsxRuntime.jsxs)(_reactNative.View,{onLayout:r,style:{flexDirection:"row",alignItems:"center",paddingVertical:6,paddingLeft:8,paddingRight:a?4:8,flexShrink:0},children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:{width:8,height:8,borderRadius:4,backgroundColor:e.backgroundColor,marginRight:6,shadowColor:e.backgroundColor,shadowOffset:{width:0,height:0},shadowOpacity:.6,shadowRadius:4,elevation:2}}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:{fontSize:11,fontWeight:"600",color:_gameUIColors.gameUIColors.primaryLight,letterSpacing:.5},children:e.label}),a&&(0,_jsxRuntime.jsx)(_index.ChevronDown,{size:12,color:_gameUIColors.gameUIColors.muted,style:{marginLeft:2}})]});if(a&&n){return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:n,style:({pressed:t})=>({opacity:t?.7:1}),accessibilityRole:"button",accessibilityLabel:`Current environment: ${e.label}. Tap to switch environment.`,children:i})}return i}

package/lib/commonjs/env/EnvironmentIndicator.web.js

@@ -1,114 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.EnvironmentIndicator = EnvironmentIndicator;
-exports.getEnvironmentConfig = getEnvironmentConfig;
-var _gameUIColors = require("../ui/gameUI/constants/gameUIColors.js");
-var _types = require("../types/types.js");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * EnvironmentIndicator — Web (React DOM) twin of EnvironmentIndicator.tsx.
- * Same env→color/label map and layout; lucide glyph icons are omitted from
- * the badge on native too (dot + label only), so parity holds.
- */
-
-function getEnvironmentConfig(environment) {
-  switch ((0, _types.normalizeEnvironment)(String(environment))) {
-    case 'dev':
-      return {
-        label: 'DEV',
-        backgroundColor: _gameUIColors.gameUIColors.warning
-      };
-    case 'qa':
-      return {
-        label: 'QA',
-        backgroundColor: _gameUIColors.gameUIColors.optional
-      };
-    case 'staging':
-      return {
-        label: 'STAGING',
-        backgroundColor: _gameUIColors.gameUIColors.success
-      };
-    case 'prod':
-      return {
-        label: 'PROD',
-        backgroundColor: _gameUIColors.gameUIColors.error
-      };
-    case 'local':
-    default:
-      return {
-        label: 'LOCAL',
-        backgroundColor: _gameUIColors.gameUIColors.info
-      };
-  }
-}
-function ChevronDownGlyph({
-  color
-}) {
-  // native: ChevronDown size 12 from shared lucide icons
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("svg", {
-    width: 12,
-    height: 12,
-    viewBox: "0 0 24 24",
-    "aria-hidden": "true",
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-      d: "M6 9l6 6 6-6",
-      fill: "none",
-      stroke: color,
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
-    })
-  });
-}
-function EnvironmentIndicator({
-  environment,
-  interactive = false,
-  onPress
-}) {
-  const envConfig = getEnvironmentConfig(environment);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
-    onClick: interactive ? onPress : undefined,
-    "aria-label": `Environment: ${envConfig.label}`,
-    style: {
-      display: 'flex',
-      flexDirection: 'row',
-      alignItems: 'center',
-      // native: paddingVertical 6, paddingLeft 8, paddingRight interactive?4:8
-      padding: `6px ${interactive ? 4 : 8}px 6px 8px`,
-      flexShrink: 0,
-      background: 'none',
-      border: 'none',
-      cursor: interactive ? 'pointer' : 'default'
-    },
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      style: {
-        width: 8,
-        height: 8,
-        borderRadius: 4,
-        backgroundColor: envConfig.backgroundColor,
-        marginRight: 6,
-        // native: shadowOpacity 0.6, shadowRadius 4 glow
-        boxShadow: `0 0 4px ${envConfig.backgroundColor}99`
-      }
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-      style: {
-        fontSize: 11,
-        fontWeight: 600,
-        color: _gameUIColors.gameUIColors.primaryLight,
-        letterSpacing: 0.5
-      },
-      children: envConfig.label
-    }), interactive && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-      style: {
-        marginLeft: 2,
-        display: 'flex'
-      },
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ChevronDownGlyph, {
-        color: "#7A8599"
-      })
-    })]
-  });
-}
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.EnvironmentIndicator=EnvironmentIndicator;exports.getEnvironmentConfig=getEnvironmentConfig;var _gameUIColors=require("../ui/gameUI/constants/gameUIColors.js");var _types=require("../types/types.js");var _jsxRuntime=require("react/jsx-runtime");function getEnvironmentConfig(e){switch((0,_types.normalizeEnvironment)(String(e))){case"dev":return{label:"DEV",backgroundColor:_gameUIColors.gameUIColors.warning};case"qa":return{label:"QA",backgroundColor:_gameUIColors.gameUIColors.optional};case"staging":return{label:"STAGING",backgroundColor:_gameUIColors.gameUIColors.success};case"prod":return{label:"PROD",backgroundColor:_gameUIColors.gameUIColors.error};case"local":default:return{label:"LOCAL",backgroundColor:_gameUIColors.gameUIColors.info}}}function ChevronDownGlyph({color:e}){return(0,_jsxRuntime.jsx)("svg",{width:12,height:12,viewBox:"0 0 24 24","aria-hidden":"true",children:(0,_jsxRuntime.jsx)("path",{d:"M6 9l6 6 6-6",fill:"none",stroke:e,strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})}function EnvironmentIndicator({environment:e,interactive:r=false,onPress:n}){const o=getEnvironmentConfig(e);return(0,_jsxRuntime.jsxs)("button",{onClick:r?n:void 0,"aria-label":`Environment: ${o.label}`,style:{display:"flex",flexDirection:"row",alignItems:"center",padding:`6px ${r?4:8}px 6px 8px`,flexShrink:0,background:"none",border:"none",cursor:r?"pointer":"default"},children:[(0,_jsxRuntime.jsx)("div",{style:{width:8,height:8,borderRadius:4,backgroundColor:o.backgroundColor,marginRight:6,boxShadow:`0 0 4px ${o.backgroundColor}99`}}),(0,_jsxRuntime.jsx)("span",{style:{fontSize:11,fontWeight:600,color:_gameUIColors.gameUIColors.primaryLight,letterSpacing:.5},children:o.label}),r&&(0,_jsxRuntime.jsx)("span",{style:{marginLeft:2,display:"flex"},children:(0,_jsxRuntime.jsx)(ChevronDownGlyph,{color:"#7A8599"})})]})}