react-native-simi-comps/dist/components/SearchBar.js

Simple Minimal Components for React Native

import React from "react";
import Icon from "./Icon";
import IconButton from "./IconButton";
import Input from "./Input";
import View from "./View";
export default function SearchBar(_a) {
    var query = _a.query, setQuery = _a.setQuery;
    var clear = function () { return setQuery(""); };
    return (React.createElement(View, { row: true },
        React.createElement(View, { row: true, flexed: true, margin: 8 },
            React.createElement(View, { row: true, style: { position: "relative" } },
                React.createElement(View, { style: {
                        position: "absolute",
                        left: 10,
                        top: "50%",
                        transform: [{ translateY: -9 }],
                        zIndex: -1
                    } },
                    React.createElement(Icon, { size: 18, name: "search" })),
                React.createElement(Input, { style: { paddingLeft: 36 }, value: query, onChangeText: setQuery, placeholder: "Search" })),
            query.length > 0 && (React.createElement(View, { style: {
                    position: "absolute",
                    right: 10,
                    top: "50%",
                    transform: [{ translateY: -13 }]
                } },
                React.createElement(IconButton, { onPress: clear, icon: "x", size: 18, bordered: false, style: { padding: 4 } }))))));
}
//# sourceMappingURL=SearchBar.js.map