/* Metro module 6785; source: modules/guild_onboarding/native/ConnectionCardView.tsx; dependencies: [31, 27, 33, 4501, 697, 4573, 1244, 4073, 4578, 2] */
import * as FileImportTrackerModule from '../../../by-id/module-00002-FileImportTracker.js'; /* Metro dependency 2 */
import * as ReactNativeModule from '../../../by-id/module-00027-ReactNative.js'; /* Metro dependency 27 */
import * as ReactModule from '../../../by-id/module-00031-React.js'; /* Metro dependency 31 */
import * as TextModule from '../../../design/components/Text/native/Text.tsx'; /* Metro dependency 4573 */

function _fun53429(global, require, importDefault, importAll, module, exports, dependencyMap) { // fn#53429, source: /ci/build/discord/discord/discord_android_rn/android/app/src/main/assets/index.android.bundle:6963:6, offset: 0x013489c3, size: 502 bytes, params: 8, frame: 23
    const env0_0 = require;
    const Object = global.Object;
    Object.defineProperty(exports, '__esModule', {value: true});
    ReactModule;
    let value = ReactNativeModule;
    const env0_2 = value.View;
    const env0_3 = value.ActivityIndicator;
    value = require(33) /* metro dependency 33 */;
    const env0_4 = value.jsx;
    const env0_5 = value.jsxs;
    value = require(4501) /* metro dependency 4501: createStyles */;
    const createStyles = value.createStyles;
    object = {};
    const object2 = {};
    const BACKGROUND_SURFACE_HIGH = (importDefault(697) /* metro dependency 697: native */).colors.BACKGROUND_SURFACE_HIGH;
    object2.backgroundColor = BACKGROUND_SURFACE_HIGH;
    object2.borderRadius = (importDefault(697) /* metro dependency 697: native */).radii.md;
    object2.borderWidth = 1;
    const BORDER_SUBTLE = (importDefault(697) /* metro dependency 697: native */).colors.BORDER_SUBTLE;
    object2.borderColor = BORDER_SUBTLE;
    const PX_16 = (importDefault(697) /* metro dependency 697: native */).space.PX_16;
    object2.padding = PX_16;
    let PX_12 = (importDefault(697) /* metro dependency 697: native */).space.PX_12;
    object2.marginBottom = PX_12;
    object2.flexDirection = 'row';
    object2.alignItems = 'center';
    object2.justifyContent = 'space-between';
    object.card = object2;
    PX_12 = (importDefault(697) /* metro dependency 697: native */).space.PX_12;
    object.leftContent = {'flexDirection': 'row', 'alignItems': 'center', 'flex': 1, marginRight: PX_12};
    PX_12 = (importDefault(697) /* metro dependency 697: native */).space.PX_12;
    object.icon = {'width': 32, 'height': 32, 'marginRight': null, 'justifyContent': 'center', 'alignItems': 'center',
        marginRight: PX_12};
    object.textContent = {flex: 1};
    const PX_8 = (importDefault(697) /* metro dependency 697: native */).space.PX_8;
    object.connectedStatus = {'flexDirection': 'row', 'alignItems': 'center', gap: PX_8};
    const env0_6 = Reflect.apply(createStyles, value, [object]);
    (FileImportTrackerModule).fileFinishedImporting('modules/guild_onboarding/native/ConnectionCardView.tsx');
    exports.default = ConnectionCardView;
    function ConnectionCardView({displayName, description, icon, isLoading, isConnected, canConnect, onConnect}) { // fn#53430, source: /ci/build/discord/discord/discord_android_rn/android/app/src/main/assets/index.android.bundle:6963:872, offset: 0x01348bb9, size: 644 bytes, params: 2, frame: 29
        var r5;
        var Button;
        const intl = (require(1244) /* metro dependency 1244: indexNative */).intl;
        var value;
        const styles = useStyles();
        const view = (
            <View style={styles.icon}>
                {icon}
            </View>
        );
        const Text = (TextModule).Text;
        const view2 = (
            <View style={styles.leftContent}>
                {view}
                <View style={styles.textContent}>
                    <Text variant="text-md/medium" color="text-strong">
                        {displayName}
                    </Text>
                    {description != null && description.length > 0 && <Text variant="text-sm/normal" color="text-subtle">{description}</Text>}
                </View>
            </View>
        );
        if (isLoading) {
            r5 = <ActivityIndicator size="small" />;
        } else if (isConnected) {
            var viewBinding2Props = {style: styles.connectedStatus};
            value = (
                <Text variant="text-sm/medium" color="text-feedback-positive">
                    {intl.string((require(1244) /* metro dependency 1244: indexNative */).t['LV+CXH'])}
                </Text>
            );
            value = (
                <View {...viewBinding2Props}>
                    {value}
                    {((CircleCheckIcon) => <CircleCheckIcon size="sm" color="status-positive" />)((require(4073) /* metro dependency 4073: CircleCheckIcon */).CircleCheckIcon)}
                </View>
            );
            r5 = value;
        } else {
            Button = (require(4578) /* metro dependency 4578: ButtonNative */).Button;
            r5 = (
                <Button
                    variant="primary"
                    size="sm"
                    onPress={onConnect}
                    text={intl.string((require(1244) /* metro dependency 1244: indexNative */).t.S0W8Z5)}
                    disabled={!canConnect}
                />
            );
        }
        return (
            <View style={styles.card}>
                {view2}
                {r5}
            </View>
        );
    }

}

global.__d(_fun53429, 6785, [31, 27, 33, 4501, 697, 4573, 1244, 4073, 4578,
        2]) /* metro module 6785, dependencies: [31, 27, 33, 4501, 697, 4573, 1244, 4073, 4578, 2] */;