"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.InputPanel = InputPanel;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const react_native_1 = require("react-native");
const hooks_1 = require("../../../hooks");
const atoms = tslib_1.__importStar(require("../../../lib/theme/atoms"));
const ui_1 = require("../../ui");
const { gap, h, layout, mt, p, position, px, py, sizes, w } = atoms;
function InputPanel({ title, setTitle, toggleGoLive, isLive, toggleStopStream, }) {
    const { slideKeyboard } = (0, hooks_1.useKeyboardSlide)();
    return ((0, jsx_runtime_1.jsx)(ui_1.View, { style: [
            layout.position.absolute,
            h.percent[30],
            position.bottom[0],
            w.percent[100],
            layout.flex.center,
            { transform: [{ translateY: slideKeyboard }] },
        ], children: (0, jsx_runtime_1.jsxs)(ui_1.View, { style: [
                layout.flex.column,
                gap.all[2],
                sizes.maxWidth[80],
                { padding: 10 },
            ], children: [!isLive && ((0, jsx_runtime_1.jsx)(ui_1.View, { backgroundColor: "rgba(64,64,64,0.8)", borderRadius: 12, children: (0, jsx_runtime_1.jsx)(ui_1.Input, { value: title, onChange: setTitle, placeholder: "Enter stream title", onEndEditing: react_native_1.Keyboard.dismiss }) })), isLive ? ((0, jsx_runtime_1.jsx)(ui_1.View, { style: [layout.flex.center], children: (0, jsx_runtime_1.jsxs)(react_native_1.Pressable, { onPress: toggleStopStream, style: [
                            px[4],
                            py[2],
                            layout.flex.row,
                            layout.flex.center,
                            gap.all[1],
                            {
                                backgroundColor: "rgba(64,64,64, 0.8)",
                                borderRadius: 12,
                            },
                        ], children: [(0, jsx_runtime_1.jsx)(ui_1.View, { style: [
                                    p[2],
                                    {
                                        backgroundColor: "rgba(256,0,0, 0.8)",
                                        borderRadius: 12,
                                    },
                                ] }), (0, jsx_runtime_1.jsx)(ui_1.Text, { center: true, children: "Stop Stream" })] }) })) : ((0, jsx_runtime_1.jsxs)(ui_1.View, { style: [layout.flex.center], children: [(0, jsx_runtime_1.jsxs)(react_native_1.Pressable, { onPress: toggleGoLive, style: [
                                px[4],
                                py[2],
                                layout.flex.row,
                                layout.flex.center,
                                gap.all[1],
                                {
                                    backgroundColor: "rgba(64,64,64, 0.8)",
                                    borderRadius: 12,
                                },
                            ], children: [(0, jsx_runtime_1.jsx)(ui_1.View, { style: [
                                        p[2],
                                        {
                                            backgroundColor: "rgba(256,0,0, 0.8)",
                                            borderRadius: 12,
                                        },
                                    ] }), (0, jsx_runtime_1.jsx)(ui_1.Text, { center: true, children: "Go Live" })] }), (0, jsx_runtime_1.jsx)(ui_1.Text, { color: "muted", size: "xs", style: [mt[2]], children: "We'll announce that you're live on Bluesky." })] }))] }) }));
}
//# sourceMappingURL=input.js.map