@buoy-gg/redux 7.0.35 → 7.0.38

package/lib/commonjs/redux/components/ReduxActionItem.js

@@ -1,334 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ReduxActionItem = void 0;
-var _react = require("react");
-var _reactNative = require("react-native");
-var _sharedUi = require("@buoy-gg/shared-ui");
-var _reduxActionStore = require("../utils/reduxActionStore");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * Compact list item for displaying a Redux action
- * Uses shared CompactRow for consistent styling with React Query devtools
- */
-
-/**
- * Color palette for async operation badges
- * Each operation gets a distinct color to make matching easy
- */
-const OPERATION_COLORS = [{
-  bg: "rgba(99, 102, 241, 0.25)",
-  text: "#818CF8"
-},
-// indigo
-{
-  bg: "rgba(236, 72, 153, 0.25)",
-  text: "#F472B6"
-},
-// pink
-{
-  bg: "rgba(14, 165, 233, 0.25)",
-  text: "#38BDF8"
-},
-// sky
-{
-  bg: "rgba(245, 158, 11, 0.25)",
-  text: "#FBBF24"
-},
-// amber
-{
-  bg: "rgba(16, 185, 129, 0.25)",
-  text: "#34D399"
-},
-// emerald
-{
-  bg: "rgba(168, 85, 247, 0.25)",
-  text: "#C084FC"
-},
-// purple
-{
-  bg: "rgba(239, 68, 68, 0.25)",
-  text: "#F87171"
-},
-// red
-{
-  bg: "rgba(20, 184, 166, 0.25)",
-  text: "#2DD4BF"
-} // teal
-];
-function getOperationColor(index) {
-  if (index <= 0) return {
-    bg: "rgba(142, 142, 147, 0.2)",
-    text: _sharedUi.buoyColors.textSecondary
-  };
-  return OPERATION_COLORS[(index - 1) % OPERATION_COLORS.length];
-}
-
-/**
- * Slice color palette - consistent colors per slice name
- * Makes it easy to visually track actions from the same slice
- */
-const SLICE_COLORS = {
-  cart: "#10B981",
-  // emerald - shopping/commerce
-  user: "#3B82F6",
-  // blue - user related
-  auth: "#8B5CF6",
-  // purple - authentication
-  app: "#6366F1",
-  // indigo - app-wide
-  ui: "#EC4899",
-  // pink - UI state
-  settings: "#F59E0B",
-  // amber - settings
-  api: "#14B8A6",
-  // teal - API calls
-  data: "#06B6D4" // cyan - data management
-};
-
-/**
- * Get consistent color for a slice based on its name
- */
-function getSliceColor(sliceName) {
-  if (!sliceName) return "#6B7280"; // gray for unknown
-
-  const lowerSlice = sliceName.toLowerCase();
-
-  // Check for exact match first
-  if (SLICE_COLORS[lowerSlice]) {
-    return SLICE_COLORS[lowerSlice];
-  }
-
-  // Check for partial matches
-  for (const [key, color] of Object.entries(SLICE_COLORS)) {
-    if (lowerSlice.includes(key)) {
-      return color;
-    }
-  }
-
-  // Generate consistent color from slice name hash
-  const hash = sliceName.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0);
-  const hue = hash * 137 % 360;
-  return `hsl(${hue}, 70%, 60%)`;
-}
-
-/**
- * Get status label based on category and slice
- */
-function getStatusLabel(category, sliceName) {
-  switch (category) {
-    case "pending":
-      return "Pending";
-    case "fulfilled":
-      return "Success";
-    case "rejected":
-      return "Error";
-    case "internal":
-      return "Internal";
-    case "query":
-      return "Query";
-    case "mutation":
-      return "Mutation";
-    default:
-      // For regular actions, show slice name if available
-      return sliceName ? sliceName.charAt(0).toUpperCase() + sliceName.slice(1) : "Action";
-  }
-}
-
-/**
- * Get color for action category
- */
-function getStatusColor(category, hasStateChange, sliceName) {
-  switch (category) {
-    case "pending":
-      return _sharedUi.buoyColors.warning;
-    case "fulfilled":
-      return _sharedUi.buoyColors.success;
-    case "rejected":
-      return _sharedUi.buoyColors.error;
-    case "internal":
-      return _sharedUi.buoyColors.textMuted;
-    case "query":
-      return _sharedUi.buoyColors.info;
-    case "mutation":
-      return _sharedUi.buoyColors.info;
-    default:
-      // For regular actions, use slice-based color
-      return getSliceColor(sliceName);
-  }
-}
-
-/**
- * Get sublabel with duration and diff info
- */
-function getSublabel(action) {
-  const parts = [];
-
-  // Add duration if available and meaningful
-  if (action.duration !== undefined && action.duration >= 0.1) {
-    parts.push(`${action.duration.toFixed(1)}ms`);
-  }
-
-  // Add diff summary - be more descriptive
-  if (action.hasStateChange) {
-    if (action.changedKeysCount && action.changedKeysCount > 0) {
-      parts.push(`${action.changedKeysCount} key${action.changedKeysCount > 1 ? 's' : ''} changed`);
-    } else {
-      parts.push(action.diffSummary || "state changed");
-    }
-  } else {
-    parts.push("no state change");
-  }
-  return parts.join(" · ");
-}
-
-/**
- * Get action name badge text
- */
-function getActionBadge(action) {
-  // Show the action name in uppercase (e.g., ADDITEM, ORDERCOMPLETED)
-  return action.actionName?.toUpperCase() || action.type.split('/').pop()?.toUpperCase() || "";
-}
-
-/**
- * Get primary text - use action name for cleaner display
- */
-function getPrimaryText(action) {
-  // For internal actions, show the full type
-  if (action.category === "internal") {
-    return action.type;
-  }
-
-  // For others, show slice/actionName format
-  if (action.sliceName) {
-    return `${action.sliceName}/${action.actionName.toLowerCase()}`;
-  }
-  return action.type;
-}
-
-// Memo justified by profiling (tool-bench 2026-07-06): ReduxActionItem
-// x172 renders during a 5s idle dwell at 200 seeded actions. The relative
-// timestamp is delegated to the shared <RelativeTime/> leaf so the 5s
-// tick re-renders only that Text, not this row.
-const ReduxActionItem = exports.ReduxActionItem = /*#__PURE__*/(0, _react.memo)(function ReduxActionItem({
-  action,
-  onPress,
-  linkedCount,
-  testID
-}) {
-  const sliceName = action.sliceName ?? undefined;
-  const statusColor = getStatusColor(action.category, action.hasStateChange, sliceName);
-  const statusLabel = getStatusLabel(action.category, sliceName);
-  const sublabel = getSublabel(action);
-  const primaryText = getPrimaryText(action);
-  const actionBadge = getActionBadge(action);
-
-  // Check for linked async actions. The COUNT comes from the list (see the
-  // prop's doc); the ordered list is only needed to say where in the flow this
-  // action sits, and only when there is a flow at all.
-  const hasLinkedActions = (linkedCount ?? 0) > 1;
-  const linkedActions = hasLinkedActions ? _reduxActionStore.reduxActionStore.getLinkedActions(action) : [];
-
-  // Get position in async sequence (1/2, 2/2, etc.)
-  const asyncPosition = hasLinkedActions ? linkedActions.findIndex(a => a.id === action.id) + 1 : 0;
-
-  // Get sequential operation index to distinguish concurrent requests (#1, #2, etc.)
-  const operationIndex = hasLinkedActions && action.meta?.requestId ? _reduxActionStore.reduxActionStore.getAsyncOperationIndex(action.meta.requestId) : 0;
-
-  // Get color for this operation's badge
-  const opColor = getOperationColor(operationIndex);
-
-  // The async-sequence chip ("1/2 #3") sits in front of whatever indicator
-  // the row shows; the ⚡ / 🕒 indicators and the mono action verb are drawn
-  // by the shared ChangeRow.
-  const sequenceChip = hasLinkedActions ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-    style: [styles.asyncSequenceBadge, {
-      backgroundColor: opColor.bg
-    }],
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
-      style: [styles.asyncSequenceText, {
-        color: opColor.text
-      }],
-      testID: testID ? `${testID}-seq` : undefined,
-      children: [asyncPosition, "/", linkedCount, " #", operationIndex]
-    })
-  }) : undefined;
-  const common = {
-    statusColor,
-    statusLabel,
-    sublabel,
-    primaryText,
-    timestamp: action.timestamp,
-    onPress: () => onPress(action),
-    testID,
-    accessibilityLabel: `${primaryText}, ${statusLabel}, ${sublabel}`
-  };
-  if (action.isSlowAction) {
-    // Slow action warning (with the sequence chip when part of a flow).
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.ChangeRow, {
-      ...common,
-      badgePrefix: sequenceChip,
-      slow: true
-    });
-  }
-  if (action.category === "rejected") {
-    // Error badge for rejected actions.
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.ChangeRow, {
-      ...common,
-      customBadge: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-        style: styles.badgeContainer,
-        children: [sequenceChip, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          style: styles.errorBadge,
-          testID: testID ? `${testID}-error` : undefined,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.AlertCircle, {
-            size: 12,
-            color: _sharedUi.buoyColors.error
-          })
-        })]
-      })
-    });
-  }
-  if (hasLinkedActions) {
-    // Linked indicator for async actions.
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.ChangeRow, {
-      ...common,
-      badgePrefix: sequenceChip,
-      changed: action.hasStateChange
-    });
-  }
-  if (action.hasStateChange) {
-    // State change indicator with the action verb.
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.ChangeRow, {
-      ...common,
-      badgeText: actionBadge,
-      changed: true
-    });
-  }
-  // Nothing special: CompactRow's plain badge with the action verb.
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.ChangeRow, {
-    ...common,
-    plainBadgeText: actionBadge
-  });
-});
-const styles = _reactNative.StyleSheet.create({
-  badgeContainer: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 4
-  },
-  errorBadge: {
-    paddingHorizontal: 4
-  },
-  asyncSequenceBadge: {
-    paddingHorizontal: 6,
-    paddingVertical: 2,
-    borderRadius: 4
-  },
-  asyncSequenceText: {
-    fontSize: 10,
-    fontWeight: "600",
-    fontFamily: _sharedUi.monoFont
-  }
-});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ReduxActionItem=void 0;var _react=require("react"),_reactNative=require("react-native"),_sharedUi=require("@buoy-gg/shared-ui"),_reduxActionStore=require("../utils/reduxActionStore"),_jsxRuntime=require("react/jsx-runtime");const OPERATION_COLORS=[{bg:"rgba(99, 102, 241, 0.25)",text:"#818CF8"},{bg:"rgba(236, 72, 153, 0.25)",text:"#F472B6"},{bg:"rgba(14, 165, 233, 0.25)",text:"#38BDF8"},{bg:"rgba(245, 158, 11, 0.25)",text:"#FBBF24"},{bg:"rgba(16, 185, 129, 0.25)",text:"#34D399"},{bg:"rgba(168, 85, 247, 0.25)",text:"#C084FC"},{bg:"rgba(239, 68, 68, 0.25)",text:"#F87171"},{bg:"rgba(20, 184, 166, 0.25)",text:"#2DD4BF"}];function getOperationColor(e){return e<=0?{bg:"rgba(142, 142, 147, 0.2)",text:_sharedUi.buoyColors.textSecondary}:OPERATION_COLORS[(e-1)%OPERATION_COLORS.length]}const SLICE_COLORS={cart:"#10B981",user:"#3B82F6",auth:"#8B5CF6",app:"#6366F1",ui:"#EC4899",settings:"#F59E0B",api:"#14B8A6",data:"#06B6D4"};function getSliceColor(e){if(!e)return"#6B7280";const t=e.toLowerCase();if(SLICE_COLORS[t])return SLICE_COLORS[t];for(const[e,r]of Object.entries(SLICE_COLORS))if(t.includes(e))return r;return`hsl(${137*e.split("").reduce((e,t)=>e+t.charCodeAt(0),0)%360}, 70%, 60%)`}function getStatusLabel(e,t){switch(e){case"pending":return"Pending";case"fulfilled":return"Success";case"rejected":return"Error";case"internal":return"Internal";case"query":return"Query";case"mutation":return"Mutation";default:return t?t.charAt(0).toUpperCase()+t.slice(1):"Action"}}function getStatusColor(e,t,r){switch(e){case"pending":return _sharedUi.buoyColors.warning;case"fulfilled":return _sharedUi.buoyColors.success;case"rejected":return _sharedUi.buoyColors.error;case"internal":return _sharedUi.buoyColors.textMuted;case"query":case"mutation":return _sharedUi.buoyColors.info;default:return getSliceColor(r)}}function getSublabel(e){const t=[];return void 0!==e.duration&&e.duration>=.1&&t.push(`${e.duration.toFixed(1)}ms`),e.hasStateChange?e.changedKeysCount&&e.changedKeysCount>0?t.push(`${e.changedKeysCount} key${e.changedKeysCount>1?"s":""} changed`):t.push(e.diffSummary||"state changed"):t.push("no state change"),t.join(" · ")}function getActionBadge(e){return e.actionName?.toUpperCase()||e.type.split("/").pop()?.toUpperCase()||""}function getPrimaryText(e){return"internal"===e.category?e.type:e.sliceName?`${e.sliceName}/${e.actionName.toLowerCase()}`:e.type}const ReduxActionItem=exports.ReduxActionItem=(0,_react.memo)(function({action:e,onPress:t,linkedCount:r,testID:a}){const n=e.sliceName??void 0,s=getStatusColor(e.category,e.hasStateChange,n),o=getStatusLabel(e.category,n),i=getSublabel(e),u=getPrimaryText(e),c=getActionBadge(e),d=(r??0)>1,g=d?_reduxActionStore.reduxActionStore.getLinkedActions(e):[],l=d?g.findIndex(t=>t.id===e.id)+1:0,x=d&&e.meta?.requestId?_reduxActionStore.reduxActionStore.getAsyncOperationIndex(e.meta.requestId):0,h=getOperationColor(x),C=d?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.asyncSequenceBadge,{backgroundColor:h.bg}],children:(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:[styles.asyncSequenceText,{color:h.text}],testID:a?`${a}-seq`:void 0,children:[l,"/",r," #",x]})}):void 0,b={statusColor:s,statusLabel:o,sublabel:i,primaryText:u,timestamp:e.timestamp,onPress:()=>t(e),testID:a,accessibilityLabel:`${u}, ${o}, ${i}`};return e.isSlowAction?(0,_jsxRuntime.jsx)(_sharedUi.ChangeRow,{...b,badgePrefix:C,slow:!0}):"rejected"===e.category?(0,_jsxRuntime.jsx)(_sharedUi.ChangeRow,{...b,customBadge:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.badgeContainer,children:[C,(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.errorBadge,testID:a?`${a}-error`:void 0,children:(0,_jsxRuntime.jsx)(_sharedUi.AlertCircle,{size:12,color:_sharedUi.buoyColors.error})})]})}):d?(0,_jsxRuntime.jsx)(_sharedUi.ChangeRow,{...b,badgePrefix:C,changed:e.hasStateChange}):e.hasStateChange?(0,_jsxRuntime.jsx)(_sharedUi.ChangeRow,{...b,badgeText:c,changed:!0}):(0,_jsxRuntime.jsx)(_sharedUi.ChangeRow,{...b,plainBadgeText:c})}),styles=_reactNative.StyleSheet.create({badgeContainer:{flexDirection:"row",alignItems:"center",gap:4},errorBadge:{paddingHorizontal:4},asyncSequenceBadge:{paddingHorizontal:6,paddingVertical:2,borderRadius:4},asyncSequenceText:{fontSize:10,fontWeight:"600",fontFamily:_sharedUi.monoFont}});

package/lib/commonjs/redux/components/ReduxAutoInstrument.js

@@ -1,20 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ReduxAutoInstrument = ReduxAutoInstrument;
-var _useAutoInstrumentRedux = require("../hooks/useAutoInstrumentRedux");
-/**
- * Headless startup instrumentation. Auto-rendered by FloatingDevTools (same
- * pattern as RouteTracker & the overlay tools) so the Redux store is bound
- * from app mount — action log, MCP getState/dispatch, and desktop sync all
- * work WITHOUT the user ever opening the Redux tool. Renders nothing.
- *
- * Safe anywhere: if react-redux is missing or there's no Provider above, the
- * hook records the diagnostic and fails gracefully.
- */
-function ReduxAutoInstrument() {
-  (0, _useAutoInstrumentRedux.useAutoInstrumentRedux)();
-  return null;
-}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ReduxAutoInstrument=ReduxAutoInstrument;var _useAutoInstrumentRedux=require("../hooks/useAutoInstrumentRedux");function ReduxAutoInstrument(){return(0,_useAutoInstrumentRedux.useAutoInstrumentRedux)(),null}

package/lib/commonjs/redux/components/ReduxDetailViewToggle.js

@@ -1,50 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ReduxDetailViewToggle = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _sharedUi = require("@buoy-gg/shared-ui");
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-/**
- * ReduxDetailViewToggle
- *
- * Three-card toggle for switching between Action, State, and Diff views.
- * The cards themselves are the shared `DetailViewToggle`; this file owns
- * the redux view list and testID prefix.
- */
-
-// Active-card chrome takes the single night accent (the per-view
-// warning/info/success tints were selection chrome, not data).
-const VIEWS = [{
-  key: "action",
-  label: "ACTION",
-  description: "View action details",
-  icon: _sharedUi.FileText
-}, {
-  key: "state",
-  label: "STATE",
-  description: "View current state",
-  icon: _sharedUi.Database
-}, {
-  key: "diff",
-  label: "DIFF",
-  description: "Compare changes",
-  icon: _sharedUi.GitBranch
-}];
-const DIFF_DISABLED = ["diff"];
-const ReduxDetailViewToggle = exports.ReduxDetailViewToggle = /*#__PURE__*/(0, _react.memo)(function ReduxDetailViewToggle({
-  activeView,
-  onViewChange,
-  diffDisabled = false
-}) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.DetailViewToggle, {
-    views: VIEWS,
-    activeView: activeView,
-    onViewChange: onViewChange,
-    disabledKeys: diffDisabled ? DIFF_DISABLED : undefined,
-    testIDPrefix: "buoy-redux"
-  });
-});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ReduxDetailViewToggle=void 0;var _react=_interopRequireWildcard(require("react")),_sharedUi=require("@buoy-gg/shared-ui"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,i){if("function"==typeof WeakMap)var t=new WeakMap,r=new WeakMap;return(_interopRequireWildcard=function(e,i){if(!i&&e&&e.__esModule)return e;var a,n,o={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return o;if(a=i?r:t){if(a.has(e))return a.get(e);a.set(e,o)}for(const i in e)"default"!==i&&{}.hasOwnProperty.call(e,i)&&((n=(a=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,i))&&(n.get||n.set)?a(o,i,n):o[i]=e[i]);return o})(e,i)}const VIEWS=[{key:"action",label:"ACTION",description:"View action details",icon:_sharedUi.FileText},{key:"state",label:"STATE",description:"View current state",icon:_sharedUi.Database},{key:"diff",label:"DIFF",description:"Compare changes",icon:_sharedUi.GitBranch}],DIFF_DISABLED=["diff"],ReduxDetailViewToggle=exports.ReduxDetailViewToggle=(0,_react.memo)(function({activeView:e,onViewChange:i,diffDisabled:t=!1}){return(0,_jsxRuntime.jsx)(_sharedUi.DetailViewToggle,{views:VIEWS,activeView:e,onViewChange:i,disabledKeys:t?DIFF_DISABLED:void 0,testIDPrefix:"buoy-redux"})});

package/lib/commonjs/redux/components/ReduxIcon.js

@@ -1,18 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "REDUX_ICON_COLOR", {
-  enumerable: true,
-  get: function () {
-    return _floatingToolsCore.REDUX_ICON_COLOR;
-  }
-});
-Object.defineProperty(exports, "ReduxIcon", {
-  enumerable: true,
-  get: function () {
-    return _floatingToolsCore.ReduxIcon;
-  }
-});
-var _floatingToolsCore = require("@buoy-gg/floating-tools-core");
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"REDUX_ICON_COLOR",{enumerable:!0,get:function(){return _floatingToolsCore.REDUX_ICON_COLOR}}),Object.defineProperty(exports,"ReduxIcon",{enumerable:!0,get:function(){return _floatingToolsCore.ReduxIcon}});var _floatingToolsCore=require("@buoy-gg/floating-tools-core");