"use strict";

import React from 'react';
import { View, Text, Switch, StyleSheet } from 'react-native';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
/**
 * Reusable setting row component with switch
 * Extracted from PrivacySettingsScreen for reuse across settings screens
 */
const SettingRow = ({
  title,
  description,
  value,
  onValueChange,
  disabled = false,
  textColor,
  mutedTextColor,
  borderColor
}) => {
  return /*#__PURE__*/_jsxs(View, {
    style: [styles.settingRow, borderColor ? {
      borderBottomColor: borderColor
    } : undefined],
    children: [/*#__PURE__*/_jsxs(View, {
      style: styles.settingInfo,
      children: [/*#__PURE__*/_jsx(Text, {
        style: [styles.settingTitle, textColor ? {
          color: textColor
        } : undefined],
        children: title
      }), description && /*#__PURE__*/_jsx(Text, {
        style: [styles.settingDescription, mutedTextColor ? {
          color: mutedTextColor
        } : undefined],
        children: description
      })]
    }), /*#__PURE__*/_jsx(Switch, {
      value: value,
      onValueChange: onValueChange,
      disabled: disabled,
      trackColor: {
        false: '#767577',
        true: '#d169e5'
      },
      thumbColor: value ? '#fff' : '#f4f3f4'
    })]
  });
};
const styles = StyleSheet.create({
  settingRow: {
    flexDirection: 'row',
    justifyContent: 'space-between',
    alignItems: 'center',
    paddingVertical: 16,
    borderBottomWidth: 1
  },
  settingInfo: {
    flex: 1,
    marginRight: 16
  },
  settingTitle: {
    fontSize: 16,
    fontWeight: '500',
    marginBottom: 4
  },
  settingDescription: {
    fontSize: 14,
    opacity: 0.7
  }
});
export default /*#__PURE__*/React.memo(SettingRow);
//# sourceMappingURL=SettingRow.js.map