dantman

module.exports = function (file, api, options) {
	const j = api.jscodeshift; // alias the jscodeshift API
	const root = j(file.source); // parse JS code into an AST

	let mutation = false;

	const isJSXIdentifier = (node, name) => j.JSXIdentifier.check(node) && node.name === name;

	// Remove the opening and closing element names if they are Fragment or React.Fragment
	const update = node => {

dantman

<span class=""><span class="pl-k" style="box-sizing:border-box;color:#d73a49;" >export</span> <span class="pl-k" style="box-sizing:border-box;color:#d73a49;" >const</span> <span class="pl-c1" style="box-sizing:border-box;color:#005cc5;" >styles</span> <span class="pl-k" style="box-sizing:border-box;color:#d73a49;" >=</span> <span class="pl-smi" style="box-sizing:border-box;color:#24292e;" >theme</span> <span class="pl-k" style="box-sizing:border-box;color:#d73a49;" >=&gt;</span> ({</span><br>
<span class="">&nbsp;  root<span class="pl-k" style="box-sizing:border-box;color:#d73a49;" >:</span> {</span><br>
<span class="yes" style="background-color:#81A594;" >&nbsp;  &nbsp;  display<span class="pl-k" style="box-sizing:border-box;color:#d73a49;" >:</span> <span class="pl-s" style="box-sizing:border-box;color:#032f62;" ><span class="pl-pds" style="box-sizing:border-box;color:#032f62;" >'</span>flex<span class="pl-pds" style="box-sizing:border-box;color:#032f62;" >'</span></span>,</span><br>
<span class="yes" style

dantman

'use strict';
import React, {PureComponent} from 'react';
import {Header} from 'react-navigation';

export default class NavigationHeader extends PureComponent {
	getScreenDetails = (screen, ...args) => {
		const screenDetails = this.props.getScreenDetails(screen, ...args);
		const {navigate, goBack} = screenDetails.navigation;

		return {

dantman

Keybase proof

I hereby claim:

• I am dantman on github.
• I am dantman (https://keybase.io/dantman) on keybase.
• I have a public key ASC7jATCYRenYm-biehrUI-OGVElMbPiszWhH5-jXsJ6jQo

To claim this, I am signing this object:

dantman

@Styles({
	root: {
		flexDirection: 'row',
		alignItems: 'center',
		justifyContent: 'center',
		borderRadius: 2,
		height: 48,
	},
	enabled: {
		backgroundColor: colors.grey600,

dantman

using VRUB;

[ExposedClass]
class PersistentStore : ExposedClass { // base class could use a different name

  Dictionary<string, string> _temporaryStore = new Dictionary<string, string>();
  Dictionary<string, string> _persistentStore = new Dictionary<string, string>();

  [ExposedMethod]
  public string Get(string key, bool temporary = false) {

dantman

	render() {
		const {styles, onLogout} = this;
		const {onOverlayStateChanged} = this;
		const {materialTheme, sections: rawSections, navigation, screenProps: {statusBarHeight}, user, activeCompany, company, teams} = this.props;
		const {overlayOpen} = this.state;
		const sections = navigation.state.routes::groupBy((route) => this._getScreenOptions(route.key).drawerSection);
		const {companyList=[]} = user || {};
		const children = [];
		let first = true;

dantman

export default class App extends PureComponent {
	state = {
		statusBarHeight: Platform.OS === 'android'
			? StatusBar.currentHeight || (Platform.Version < 23 ? 25 : 24)
			: 0,
	};

	render() {
		const {styles} = this;

dantman

React Native Material Design/Kit merge plan

Take components from react-native-material-design and react-native-material-kit and create a new library to replace both.

Ripple

Deciding how to handle ripples will be very important as both do it differently.

rnmd does it using a Ripple polyfill:

• Pro: The native touchable feedback is used where available.

dantman

import React, {PureComponent} from 'react';
import {View} from 'react-native';
import Styles from './Styles';

@Styles({
  root: {
    // ...
  },
})
export default class Example extends PureComponent {