react-native-inline-keyboard/dist/react-native-inline-keyboard.js

Inline keyboard for React Native TV Applications

var e=require("react"),t=require("react-native");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=n(e),o=function(e){var n,o;function s(){var t;return(t=e.apply(this,arguments)||this).state={focused:!1},t.onFocus=function(){t.setState({focused:!0})},t.onBlur=function(){t.setState({focused:!1})},t.onPress=function(e){"select"===e.eventType&&e.eventKeyAction&&t.props.onPress&&t.props.onPress(e)},t}return o=e,(n=s).prototype=Object.create(o.prototype),n.prototype.constructor=n,n.__proto__=o,s.prototype.render=function(){var e=this.props,n=e.style,o=e.focusStyles,s=void 0===o?{}:o,l=function(e,t){if(null==e)return{};var n,r,o={},s=Object.keys(e);for(r=0;r<s.length;r++)t.indexOf(n=s[r])>=0||(o[n]=e[n]);return o}(e,["style","focusStyles"]);return r.default.createElement(t.TouchableOpacity,Object.assign({},l,{style:[n,this.state.focused?s:{}],onFocus:this.onFocus,onBlur:this.onBlur,onPress:this.onPress}))},s}(r.default.Component),s=function(e){return r.default.createElement(o,{style:e.letterButtonStyles,focusStyles:e.letterButtonFocusStyles,activeOpacity:1,onPress:e.onPress,testID:e.testID},r.default.createElement(t.Text,{style:e.letterButtonTextStyles},e.children))},l={EN:{letters:["a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z"],symbols:["1","2","3","4","5","6","7","8","9","0","-","=","+","_","!","#","%","(",")"]}},u=t.StyleSheet.create({input:{backgroundColor:"#e9e9e9",borderRadius:5,padding:10},inputText:{color:"black"},letterContainer:{flexDirection:"row",marginTop:5},letterButton:{padding:2,paddingLeft:4,paddingRight:4,borderRadius:5,backgroundColor:"transparent",marginRight:5},letterButtonFocus:{backgroundColor:"#e9e9e9"},letterText:{color:"black"}});module.exports=function(e){var n=r.default.useState(!1),o=n[0],a=n[1],c=r.default.useState("uppercase"),i=c[0],p=c[1],f=e.onChange,d=e.value,y=e.showInput,b=void 0!==y&&y,m=e.letterContainerStyles,g=void 0===m?u.letterContainer:m,S=e.letterButtonStyles,v=void 0===S?u.letterButton:S,E=e.letterButtonFocusStyles,h=void 0===E?u.letterButtonFocus:E,B=e.letterButtonTextStyles,x=void 0===B?u.letterText:B,C=e.language,T=void 0===C?"EN":C,P="string"==typeof T?function(e){return void 0===e&&(e="EN"),l[e]?l[e]:l.EN}(T):T,O={letterButtonStyles:v,letterButtonFocusStyles:h,letterButtonTextStyles:x},j=function(){return"lowercase"===i?"uppercase":"lowercase"},w=function(e){return function(){f(""+d+e)}};return r.default.createElement(t.View,null,b&&r.default.createElement(t.View,{style:u.input},r.default.createElement(t.Text,{style:u.inputText},d||"Type Something")),r.default.createElement(t.View,null,r.default.createElement(t.View,{style:g},P.symbols&&r.default.createElement(s,Object.assign({},O,{onPress:function(){a(!o)},testID:"symbols-button"}),"123"),r.default.createElement(s,Object.assign({},O,{onPress:function(){p(j())},testID:"text-transform-button"}),j().toUpperCase()),P.letters.map(function(e){return r.default.createElement(s,Object.assign({},O,{letterButtonTextStyles:[O.letterButtonTextStyles,{textTransform:i}],testID:"letter-"+e+"-"+i,key:e,onPress:w("uppercase"===i?e.toUpperCase():e.toLowerCase())}),e.toUpperCase())}),r.default.createElement(s,Object.assign({},O,{testID:"space-button",onPress:w(" ")}),"space".toUpperCase()),r.default.createElement(s,Object.assign({},O,{testID:"delete-button",onPress:function(){f(d.substring(0,d.length-1))}}),"backspace".toUpperCase()),r.default.createElement(s,Object.assign({},O,{onPress:function(){f("")}}),"clear".toUpperCase())),o&&P.symbols&&r.default.createElement(t.View,{style:g,testID:"symbols-container"},P.symbols.map(function(e){return r.default.createElement(s,Object.assign({},O,{testID:"symbol-"+e,key:e,onPress:w(e)}),e.toUpperCase())}))))};
//# sourceMappingURL=react-native-inline-keyboard.js.map