react-native-inapp-inspector 1.1.11 → 1.1.12

package/dist/commonjs/components/ReduxTreeView.js

@@ -32,94 +32,25 @@ var __importStar = (this && this.__importStar) || (function () {
         return result;
     };
 })();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ReduxActionTimeline = exports.ReduxTreeView = exports.ReduxTreeIcon = exports.ReduxTimelineIcon = exports.ReduxBoltIcon = exports.ReduxStoreIcon = void 0;
+exports.ReduxTreeView = exports.ReduxStoreIcon = void 0;
 const react_1 = __importStar(require("react"));
 const react_native_1 = require("react-native");
 const AppColors_1 = require("../styles/AppColors");
 const AppFonts_1 = require("../styles/AppFonts");
 const NetworkIcons_1 = require("./NetworkIcons");
 const react_native_svg_1 = __importStar(require("react-native-svg"));
-const AnimatedEntrance_1 = __importDefault(require("./AnimatedEntrance"));
-const helpers_1 = require("../helpers");
-// #15 — copy-to-clipboard control for a single dispatched action
-const ActionCopyButton = ({ value }) => {
-    const [copied, setCopied] = (0, react_1.useState)(false);
-    return (<react_native_1.Pressable hitSlop={10} onPress={() => {
-            (0, helpers_1.copyToClipboard)(value(), 'Action');
-            setCopied(true);
-            setTimeout(() => setCopied(false), 1200);
-        }} style={{
-            width: 26,
-            height: 26,
-            borderRadius: 7,
-            alignItems: 'center',
-            justifyContent: 'center',
-            backgroundColor: copied
-                ? `${AppColors_1.AppColors.greenColor}1A`
-                : AppColors_1.AppColors.grayBackground,
-            borderWidth: 1,
-            borderColor: AppColors_1.AppColors.dividerColor,
-        }}>
-      {copied ? (<NetworkIcons_1.CheckIcon color={AppColors_1.AppColors.greenColor} size={13}/>) : (<NetworkIcons_1.CopyIcon color={AppColors_1.AppColors.grayTextWeak} size={13}/>)}
-    </react_native_1.Pressable>);
-};
-// #15 — derive the redux module / folder name from an action type.
-// Supports RTK slice convention ("booking/setDate" -> "Booking") and
-// falls back to the first affected slice.
-const getActionModule = (type, affectedSlices) => {
-    if (type && type.includes('/')) {
-        const prefix = type.split('/')[0];
-        if (prefix)
-            return prefix.charAt(0).toUpperCase() + prefix.slice(1);
-    }
-    if (affectedSlices && affectedSlices.length > 0) {
-        const s = affectedSlices[0];
-        return s.charAt(0).toUpperCase() + s.slice(1);
-    }
-    return null;
-};
-// Custom icons
-const DatabaseIcon = ({ color = AppColors_1.AppColors.grayTextWeak, size = 12 }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
-    <react_native_svg_1.Path d="M12 2C6.5 2 2 4.2 2 7v10c0 2.8 4.5 5 10 5s10-2.2 10-5V7c0-2.8-4.5-5-10-5z" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
-    <react_native_svg_1.Path d="M2 12c0 2.8 4.5 5 10 5s10-2.2 10-5" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
-    <react_native_svg_1.Path d="M2 7c0 2.8 4.5 5 10 5s10-2.2 10-5" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
-  </react_native_svg_1.default>);
-const BoltIcon = ({ color = AppColors_1.AppColors.grayTextWeak, size = 12 }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
-    <react_native_svg_1.Path d="M13 2L3 14h9l-1 8 10-12h-9l1-8z" fill={color} stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"/>
-  </react_native_svg_1.default>);
 const FolderIcon = ({ color = AppColors_1.AppColors.grayTextWeak, size = 12 }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
     <react_native_svg_1.Path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
   </react_native_svg_1.default>);
-// Exported icons so the Redux tab's section headers and sub-tab buttons can
-// render real vector icons instead of emoji (which fail to render on some
-// Android/font setups).
 const ReduxStoreIcon = ({ color = AppColors_1.AppColors.grayTextWeak, size = 12, }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
     <react_native_svg_1.Path d="M3 9l1.5-5h15L21 9M3 9v10a1 1 0 0 0 1 1h16a1 1 0 0 0 1-1V9M3 9h18M7 9v3a2 2 0 0 0 4 0V9m2 0v3a2 2 0 0 0 4 0V9" stroke={color} strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round"/>
   </react_native_svg_1.default>);
 exports.ReduxStoreIcon = ReduxStoreIcon;
-const ReduxBoltIcon = ({ color = AppColors_1.AppColors.grayTextWeak, size = 12, }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
-    <react_native_svg_1.Path d="M13 2L3 14h9l-1 8 10-12h-9l1-8z" fill={color} stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"/>
-  </react_native_svg_1.default>);
-exports.ReduxBoltIcon = ReduxBoltIcon;
-// Action Timeline — a history/clock icon reads as "sequence over time".
-const ReduxTimelineIcon = ({ color = AppColors_1.AppColors.grayTextWeak, size = 12, }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
-    <react_native_svg_1.Path d="M3 3v5h5" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
-    <react_native_svg_1.Path d="M3.05 13A9 9 0 1 0 6 5.3L3 8" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
-    <react_native_svg_1.Path d="M12 7v5l3 2" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
-  </react_native_svg_1.default>);
-exports.ReduxTimelineIcon = ReduxTimelineIcon;
-// Store Tree — a node hierarchy icon reads as "nested tree structure".
-const ReduxTreeIcon = ({ color = AppColors_1.AppColors.grayTextWeak, size = 12, }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
-    <react_native_svg_1.Path d="M9 4h6v4H9zM3 16h6v4H3zm12 0h6v4h-6z" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
-    <react_native_svg_1.Path d="M12 8v4M6 16v-2h12v2" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
-  </react_native_svg_1.default>);
-exports.ReduxTreeIcon = ReduxTreeIcon;
 const animateTreeLayout = () => {
-    react_native_1.LayoutAnimation.configureNext(react_native_1.LayoutAnimation.Presets.easeInEaseOut);
+    if (react_native_1.Platform.OS === 'ios') {
+        react_native_1.LayoutAnimation.configureNext(react_native_1.LayoutAnimation.Presets.easeInEaseOut);
+    }
 };
 const AnimatedChevron = ({ color, expanded, size, style, }) => {
     const progress = (0, react_1.useRef)(new react_native_1.Animated.Value(expanded ? 1 : 0)).current;
@@ -138,7 +69,7 @@ const AnimatedChevron = ({ color, expanded, size, style, }) => {
       <NetworkIcons_1.ChevronIcon color={color} size={size}/>
     </react_native_1.Animated.View>);
 };
-const ReduxValueNode = ({ name, value, level, search }) => {
+const ReduxValueNode = ({ name, value, level, search, lastAction }) => {
     const [expanded, setExpanded] = (0, react_1.useState)(level < 1);
     const isObject = typeof value === 'object' && value !== null;
     const isArray = Array.isArray(value);
@@ -166,7 +97,6 @@ const ReduxValueNode = ({ name, value, level, search }) => {
             : value === undefined
                 ? 'undefined'
                 : String(value);
-        // Pick different colors for primitives
         let valColor = '#0D9488'; // String
         if (value === null || value === undefined) {
             valColor = AppColors_1.AppColors.grayTextWeak;
@@ -179,13 +109,20 @@ const ReduxValueNode = ({ name, value, level, search }) => {
         }
         return (<react_native_1.View style={[reduxValueStyles.treeRow, { paddingLeft: 12 }]}>
         <react_native_1.View style={reduxValueStyles.treeLeafConnector}/>
-        <react_native_1.Text style={reduxValueStyles.keyText} selectable={true}>
-          {nameStr}
-          <react_native_1.Text style={reduxValueStyles.colonText}>: </react_native_1.Text>
-          <react_native_1.Text style={[reduxValueStyles.valText, { color: valColor }]} selectable={true}>
-            {valStr}
+        <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', flex: 1, flexWrap: 'wrap', gap: 6 }}>
+          <react_native_1.Text style={reduxValueStyles.keyText} selectable={true}>
+            {nameStr}
+            <react_native_1.Text style={reduxValueStyles.colonText}>: </react_native_1.Text>
+            <react_native_1.Text style={[reduxValueStyles.valText, { color: valColor }]} selectable={true}>
+              {valStr}
+            </react_native_1.Text>
           </react_native_1.Text>
-        </react_native_1.Text>
+          {lastAction && (<react_native_1.View style={styles.actionTypeBadge}>
+              <react_native_1.Text style={styles.actionTypeText} numberOfLines={1}>
+                {lastAction.type}
+              </react_native_1.Text>
+            </react_native_1.View>)}
+        </react_native_1.View>
       </react_native_1.View>);
     }
     const keys = Object.keys(value);
@@ -199,11 +136,18 @@ const ReduxValueNode = ({ name, value, level, search }) => {
         }} style={reduxValueStyles.treeRow}>
         <react_native_1.View style={reduxValueStyles.treeLeafConnector}/>
         <AnimatedChevron color={AppColors_1.AppColors.grayTextWeak} expanded={expanded} size={10} style={reduxValueStyles.chevronWrap}/>
-        <react_native_1.Text style={reduxValueStyles.keyText} selectable={true}>
-          {nameStr}
-          <react_native_1.Text style={reduxValueStyles.colonText}>: </react_native_1.Text>
-          <react_native_1.Text style={reduxValueStyles.summaryText}>{summaryText}</react_native_1.Text>
-        </react_native_1.Text>
+        <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', flex: 1, flexWrap: 'wrap', gap: 6 }}>
+          <react_native_1.Text style={reduxValueStyles.keyText} selectable={true}>
+            {nameStr}
+            <react_native_1.Text style={reduxValueStyles.colonText}>: </react_native_1.Text>
+            <react_native_1.Text style={reduxValueStyles.summaryText}>{summaryText}</react_native_1.Text>
+          </react_native_1.Text>
+          {lastAction && (<react_native_1.View style={styles.actionTypeBadge}>
+              <react_native_1.Text style={styles.actionTypeText} numberOfLines={1}>
+                {lastAction.type}
+              </react_native_1.Text>
+            </react_native_1.View>)}
+        </react_native_1.View>
       </react_native_1.Pressable>
       {expanded && (<react_native_1.View style={reduxValueStyles.treeChildrenContainer}>
           {keys.map(key => (<ReduxValueNode key={key} name={key} value={value[key]} level={level + 1} search={search}/>))}
@@ -248,7 +192,7 @@ const ReduxTreeView = ({ state, lastActionMap, search, }) => {
           <react_native_1.Text style={styles.storeTitle}>Redux Store</react_native_1.Text>
         </react_native_1.View>
         <react_native_1.View style={styles.badge}>
-          <react_native_1.Text style={styles.badgeText}>{reducers.length} Reducers</react_native_1.Text>
+          <react_native_1.Text style={styles.badgeText}>{reducers.length} Slices</react_native_1.Text>
         </react_native_1.View>
       </react_native_1.Pressable>
 
@@ -262,7 +206,7 @@ const ReduxTreeView = ({ state, lastActionMap, search, }) => {
                 {/* Visual Branch Line for Reducer */}
                 <react_native_1.View style={[
                         styles.reducerVerticalLine,
-                        isLastReducer && { bottom: '50%' },
+                        isLastReducer && !isExpanded && { bottom: '50%' },
                     ]}/>
 
                 {/* Reducer Header */}
@@ -272,57 +216,20 @@ const ReduxTreeView = ({ state, lastActionMap, search, }) => {
                   <react_native_1.View style={styles.iconWrap}>
                     <FolderIcon color={AppColors_1.AppColors.purple} size={11}/>
                   </react_native_1.View>
-                  <react_native_1.Text style={styles.reducerText}>{reducerKey}</react_native_1.Text>
+                  <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', flex: 1, flexWrap: 'wrap', gap: 6 }}>
+                    <react_native_1.Text style={styles.reducerText}>{reducerKey}</react_native_1.Text>
+                    {lastAction && (<react_native_1.View style={styles.actionTypeBadge}>
+                        <react_native_1.Text style={styles.actionTypeText} numberOfLines={1}>
+                          {lastAction.type}
+                        </react_native_1.Text>
+                      </react_native_1.View>)}
+                  </react_native_1.View>
                 </react_native_1.Pressable>
 
                 {isExpanded && (<react_native_1.View style={styles.reducerChildren}>
                     {/* Vertical line connecting children */}
                     <react_native_1.View style={styles.childrenVerticalLine}/>
-
-                    {/* Node 1: Last Action */}
-                    <react_native_1.View style={styles.childItem}>
-                      <react_native_1.View style={styles.childHorizontalLine}/>
-                      <react_native_1.View style={[styles.iconWrap, { backgroundColor: '#FDF2F8' }]}>
-                        <BoltIcon color="#DB2777" size={11}/>
-                      </react_native_1.View>
-                      <react_native_1.View style={{ flex: 1 }}>
-                        <react_native_1.View style={{
-                            flexDirection: 'row',
-                            alignItems: 'center',
-                            flexWrap: 'wrap',
-                            gap: 6,
-                        }}>
-                          <react_native_1.Text style={styles.childLabel}>Last Action:</react_native_1.Text>
-                          {lastAction ? (<react_native_1.View style={styles.actionTypeBadge}>
-                              <react_native_1.Text style={styles.actionTypeText}>
-                                {lastAction.type}
-                              </react_native_1.Text>
-                            </react_native_1.View>) : (<react_native_1.Text style={styles.noActionText}>
-                              None dispatched
-                            </react_native_1.Text>)}
-                        </react_native_1.View>
-                        {lastAction && (<react_native_1.Text style={styles.timestampText}>
-                            Dispatched: {lastAction.timestamp}
-                          </react_native_1.Text>)}
-                        {lastAction && lastAction.payload !== null && (<react_native_1.View style={{ marginTop: 6 }}>
-                            <ReduxValueNode name="payload" value={lastAction.payload} level={0} search={search}/>
-                          </react_native_1.View>)}
-                      </react_native_1.View>
-                    </react_native_1.View>
-
-                    {/* Node 2: State Data */}
-                    <react_native_1.View style={styles.childItem}>
-                      <react_native_1.View style={[styles.childHorizontalLine, { bottom: '50%' }]}/>
-                      <react_native_1.View style={[styles.iconWrap, { backgroundColor: '#ECFDF5' }]}>
-                        <DatabaseIcon color="#059669" size={11}/>
-                      </react_native_1.View>
-                      <react_native_1.View style={{ flex: 1 }}>
-                        <react_native_1.Text style={styles.childLabel}>State Slice Data</react_native_1.Text>
-                        <react_native_1.View style={{ marginTop: 6 }}>
-                          <ReduxValueNode name="state" value={sliceData} level={0} search={search}/>
-                        </react_native_1.View>
-                      </react_native_1.View>
-                    </react_native_1.View>
+                    {typeof sliceData === 'object' && sliceData !== null ? (Object.keys(sliceData).map(k => (<ReduxValueNode key={k} name={k} value={sliceData[k]} level={0} search={search}/>))) : (<ReduxValueNode name={reducerKey} value={sliceData} level={0} search={search} lastAction={lastAction}/>)}
                   </react_native_1.View>)}
               </react_native_1.View>);
             })}
@@ -330,135 +237,6 @@ const ReduxTreeView = ({ state, lastActionMap, search, }) => {
     </react_native_1.View>);
 };
 exports.ReduxTreeView = ReduxTreeView;
-const ReduxActionTimeline = ({ history, onClear, search, }) => {
-    const [expandedActionId, setExpandedActionId] = (0, react_1.useState)(null);
-    const toggleExpand = (id) => {
-        animateTreeLayout();
-        setExpandedActionId(prev => (prev === id ? null : id));
-    };
-    const filteredHistory = history.filter(action => {
-        if (!search)
-            return true;
-        const s = search.toLowerCase();
-        if (action.type.toLowerCase().includes(s))
-            return true;
-        if (action.affectedSlices.some(slice => slice.toLowerCase().includes(s)))
-            return true;
-        if (action.payload && typeof action.payload === 'object') {
-            return JSON.stringify(action.payload).toLowerCase().includes(s);
-        }
-        return false;
-    });
-    return (<react_native_1.View style={timelineStyles.container}>
-      <react_native_1.View style={timelineStyles.headerRow}>
-        <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 6 }}>
-          <exports.ReduxBoltIcon color={AppColors_1.AppColors.purple} size={15}/>
-          <react_native_1.Text style={timelineStyles.headerTitle}>
-            Dispatched Actions ({filteredHistory.length})
-          </react_native_1.Text>
-        </react_native_1.View>
-        {history.length > 0 && (<react_native_1.Pressable onPress={onClear} style={timelineStyles.clearBtn}>
-            <react_native_1.Text style={timelineStyles.clearBtnText}>Clear Log</react_native_1.Text>
-          </react_native_1.Pressable>)}
-      </react_native_1.View>
-
-      {filteredHistory.length === 0 ? (<react_native_1.View style={timelineStyles.emptyContainer}>
-          <react_native_1.Text style={timelineStyles.emptyText}>
-            {history.length === 0
-                ? 'No actions dispatched yet.\nDispatch actions in your application to see the timeline.'
-                : 'No matching actions found.'}
-          </react_native_1.Text>
-        </react_native_1.View>) : (<react_native_1.View style={timelineStyles.listContainer}>
-          {filteredHistory.map((item, index) => {
-                const isLast = index === filteredHistory.length - 1;
-                const isExpanded = expandedActionId === item.id;
-                return (<AnimatedEntrance_1.default key={item.id} index={index} distance={8} style={timelineStyles.timelineItem}>
-                {/* Visual Line */}
-                <react_native_1.View style={[
-                        timelineStyles.verticalLine,
-                        isLast && { bottom: '50%' },
-                    ]}/>
-                <react_native_1.View style={timelineStyles.circleIndicator}>
-                  <react_native_1.View style={timelineStyles.circleInner}/>
-                </react_native_1.View>
-
-                {/* Card */}
-                <react_native_1.Pressable onPress={() => toggleExpand(item.id)} style={[
-                        timelineStyles.card,
-                        isExpanded && {
-                            borderColor: AppColors_1.AppColors.purple,
-                            backgroundColor: AppColors_1.AppColors.purpleShade50,
-                        },
-                    ]}>
-                  <react_native_1.View style={timelineStyles.cardHeader}>
-                    <react_native_1.View style={{
-                        flexDirection: 'row',
-                        alignItems: 'center',
-                        gap: 6,
-                        flex: 1,
-                    }}>
-                      {(() => {
-                        const moduleName = getActionModule(item.type, item.affectedSlices);
-                        return moduleName ? (<react_native_1.View style={{
-                                paddingHorizontal: 7,
-                                paddingVertical: 2,
-                                borderRadius: 6,
-                                backgroundColor: `${AppColors_1.AppColors.purple}14`,
-                                borderWidth: 1,
-                                borderColor: `${AppColors_1.AppColors.purple}33`,
-                            }}>
-                            <react_native_1.Text style={{
-                                fontFamily: AppFonts_1.AppFonts.interBold,
-                                fontSize: 9.5,
-                                color: AppColors_1.AppColors.purple,
-                                letterSpacing: 0.2,
-                            }}>
-                              {moduleName}
-                            </react_native_1.Text>
-                          </react_native_1.View>) : null;
-                    })()}
-                      <react_native_1.View style={timelineStyles.typeBadge}>
-                        <react_native_1.Text style={timelineStyles.typeText}>{item.type}</react_native_1.Text>
-                      </react_native_1.View>
-                    </react_native_1.View>
-                    <react_native_1.View style={{
-                        flexDirection: 'row',
-                        alignItems: 'center',
-                        gap: 8,
-                    }}>
-                      <react_native_1.Text style={timelineStyles.timestamp}>
-                        {item.timestamp}
-                      </react_native_1.Text>
-                      <ActionCopyButton value={() => ({
-                        type: item.type,
-                        payload: item.payload,
-                    })}/>
-                    </react_native_1.View>
-                  </react_native_1.View>
-
-                  {item.affectedSlices.length > 0 && (<react_native_1.View style={timelineStyles.slicesRow}>
-                      <react_native_1.Text style={timelineStyles.slicesLabel}>Affected:</react_native_1.Text>
-                      {item.affectedSlices.map(slice => (<react_native_1.View key={slice} style={timelineStyles.slicePill}>
-                          <react_native_1.Text style={timelineStyles.sliceText}>{slice}</react_native_1.Text>
-                        </react_native_1.View>))}
-                    </react_native_1.View>)}
-
-                  {isExpanded && (<react_native_1.View style={timelineStyles.payloadContainer}>
-                      <react_native_1.Text style={timelineStyles.payloadTitle}>Payload</react_native_1.Text>
-                      {item.payload !== null &&
-                            typeof item.payload === 'object' ? (<ReduxValueNode name="action.payload" value={item.payload} level={0} search={search}/>) : (<react_native_1.Text style={timelineStyles.primitivePayload}>
-                          {item.payload === null
-                                ? 'null'
-                                : String(item.payload)}
-                        </react_native_1.Text>)}
-                    </react_native_1.View>)}
-                </react_native_1.Pressable>
-              </AnimatedEntrance_1.default>);
-            })}
-        </react_native_1.View>)}
-    </react_native_1.View>);
-};
-exports.ReduxActionTimeline = ReduxActionTimeline;
 const reduxValueStyles = react_native_1.StyleSheet.create({
     treeNodeBlock: {
         marginTop: 4,
@@ -510,158 +288,6 @@ const reduxValueStyles = react_native_1.StyleSheet.create({
         color: AppColors_1.AppColors.grayTextWeak,
     },
 });
-const timelineStyles = react_native_1.StyleSheet.create({
-    container: {
-        flex: 1,
-    },
-    headerRow: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        justifyContent: 'space-between',
-        marginBottom: 12,
-    },
-    headerTitle: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 14,
-        color: AppColors_1.AppColors.primaryBlack,
-    },
-    clearBtn: {
-        backgroundColor: 'rgba(239, 68, 68, 0.08)',
-        borderColor: 'rgba(239, 68, 68, 0.2)',
-        borderWidth: 1,
-        paddingHorizontal: 8,
-        paddingVertical: 4,
-        borderRadius: 6,
-    },
-    clearBtnText: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 10,
-        color: '#EF4444',
-    },
-    emptyContainer: {
-        paddingVertical: 32,
-        alignItems: 'center',
-        justifyContent: 'center',
-    },
-    emptyText: {
-        fontFamily: AppFonts_1.AppFonts.interRegular,
-        fontSize: 12,
-        color: AppColors_1.AppColors.grayTextWeak,
-        textAlign: 'center',
-        lineHeight: 18,
-    },
-    listContainer: {
-        paddingLeft: 12,
-    },
-    timelineItem: {
-        position: 'relative',
-        paddingLeft: 20,
-        marginBottom: 12,
-    },
-    verticalLine: {
-        position: 'absolute',
-        left: 4,
-        top: 0,
-        bottom: -12,
-        width: 1,
-        backgroundColor: AppColors_1.AppColors.dividerColor,
-    },
-    circleIndicator: {
-        position: 'absolute',
-        left: 0,
-        top: 10,
-        width: 9,
-        height: 9,
-        borderRadius: 4.5,
-        backgroundColor: AppColors_1.AppColors.purpleShade50,
-        borderWidth: 1,
-        borderColor: AppColors_1.AppColors.purple,
-        alignItems: 'center',
-        justifyContent: 'center',
-    },
-    circleInner: {
-        width: 3,
-        height: 3,
-        borderRadius: 1.5,
-        backgroundColor: AppColors_1.AppColors.purple,
-    },
-    card: {
-        backgroundColor: AppColors_1.AppColors.primaryLight,
-        borderWidth: 1,
-        borderColor: AppColors_1.AppColors.grayBorderSecondary,
-        borderRadius: 8,
-        padding: 10,
-    },
-    cardHeader: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        justifyContent: 'space-between',
-        gap: 12,
-    },
-    typeBadge: {
-        backgroundColor: 'rgba(104,75,155,0.08)',
-        borderColor: 'rgba(104,75,155,0.18)',
-        borderWidth: 1,
-        borderRadius: 6,
-        paddingHorizontal: 6,
-        paddingVertical: 2.5,
-        flexShrink: 1,
-    },
-    typeText: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 11,
-        color: AppColors_1.AppColors.purple,
-    },
-    timestamp: {
-        fontFamily: AppFonts_1.AppFonts.interRegular,
-        fontSize: 10,
-        color: AppColors_1.AppColors.grayTextWeak,
-    },
-    slicesRow: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        flexWrap: 'wrap',
-        gap: 4,
-        marginTop: 6,
-    },
-    slicesLabel: {
-        fontFamily: AppFonts_1.AppFonts.interMedium,
-        fontSize: 10,
-        color: AppColors_1.AppColors.grayTextWeak,
-        marginRight: 2,
-    },
-    slicePill: {
-        backgroundColor: AppColors_1.AppColors.grayBackground,
-        borderColor: AppColors_1.AppColors.dividerColor,
-        borderWidth: 1,
-        borderRadius: 4,
-        paddingHorizontal: 4,
-        paddingVertical: 1,
-    },
-    sliceText: {
-        fontFamily: AppFonts_1.AppFonts.interMedium,
-        fontSize: 9,
-        color: AppColors_1.AppColors.grayText,
-    },
-    payloadContainer: {
-        marginTop: 10,
-        borderTopWidth: 1,
-        borderTopColor: AppColors_1.AppColors.dividerColor,
-        paddingTop: 8,
-    },
-    payloadTitle: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 10,
-        color: AppColors_1.AppColors.grayTextWeak,
-        textTransform: 'uppercase',
-        marginBottom: 4,
-    },
-    primitivePayload: {
-        fontFamily: AppFonts_1.AppFonts.interRegular,
-        fontSize: 11,
-        color: AppColors_1.AppColors.grayTextStrong,
-    },
-});
 const styles = react_native_1.StyleSheet.create({
     container: {
         flex: 1,
@@ -756,27 +382,6 @@ const styles = react_native_1.StyleSheet.create({
         width: 1,
         backgroundColor: AppColors_1.AppColors.dividerColor,
     },
-    childItem: {
-        flexDirection: 'row',
-        alignItems: 'flex-start',
-        gap: 8,
-        position: 'relative',
-        paddingLeft: 12,
-    },
-    childHorizontalLine: {
-        position: 'absolute',
-        left: -12,
-        top: 10,
-        width: 12,
-        height: 1,
-        backgroundColor: AppColors_1.AppColors.dividerColor,
-    },
-    childLabel: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 11.5,
-        color: AppColors_1.AppColors.grayText,
-        marginTop: 2,
-    },
     actionTypeBadge: {
         backgroundColor: '#FCE7F3',
         borderColor: '#FBCFE8',
@@ -784,21 +389,11 @@ const styles = react_native_1.StyleSheet.create({
         borderRadius: 6,
         paddingHorizontal: 6,
         paddingVertical: 2,
+        alignSelf: 'flex-start',
     },
     actionTypeText: {
         fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 10.5,
+        fontSize: 10,
         color: '#BE185D',
     },
-    noActionText: {
-        fontFamily: AppFonts_1.AppFonts.interRegular,
-        fontSize: 11,
-        color: AppColors_1.AppColors.grayTextWeak,
-    },
-    timestampText: {
-        fontFamily: AppFonts_1.AppFonts.interRegular,
-        fontSize: 9.5,
-        color: AppColors_1.AppColors.grayTextWeak,
-        marginTop: 2,
-    },
 });

package/dist/commonjs/components/TouchableScale.js

@@ -36,6 +36,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importStar(require("react"));
 const react_native_1 = require("react-native");
 const TouchableScale = ({ onPress, style, children, hitSlop, disabled, }) => {
+    if (react_native_1.Platform.OS === 'android') {
+        return (<react_native_1.Pressable disabled={disabled} onPress={onPress} hitSlop={hitSlop} style={({ pressed }) => [
+                style,
+                { opacity: pressed ? 0.75 : 1 },
+            ]}>
+        {children}
+      </react_native_1.Pressable>);
+    }
     const scale = (0, react_1.useRef)(new react_native_1.Animated.Value(1)).current;
     const opacity = (0, react_1.useRef)(new react_native_1.Animated.Value(1)).current;
     const animatePress = (pressed) => {

package/dist/commonjs/constants/version.d.ts

@@ -1 +1 @@
-export declare const LIB_VERSION = "1.1.11";
+export declare const LIB_VERSION = "1.1.12";

package/dist/commonjs/constants/version.js

@@ -3,4 +3,4 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.LIB_VERSION = void 0;
 // AUTO-GENERATED FILE — do not edit by hand.
 // Regenerated from package.json on every build by scripts/gen-version.js.
-exports.LIB_VERSION = '1.1.11';
+exports.LIB_VERSION = '1.1.12';

package/dist/commonjs/helpers/index.d.ts

@@ -19,3 +19,5 @@ export declare const getLocalizedFilePath: (path: string | any, country: string
 export declare const getLocalizedFilePathWithSlash: (path: string | any, country: string | any, language: string | any) => any;
 export declare const isAllValuesEmpty: (obj: Record<string, any>) => boolean;
 export declare const formatDateTimeToAnalytics: (ts: number) => string;
+export declare const getBundleIdentifier: () => string;
+export declare const getAppName: () => string;