giuseppeg

const focusableSelectors = [
    'a[href]:not([tabindex^="-"]):not([inert])',
    'area[href]:not([tabindex^="-"]):not([inert])',
    'input:not([disabled]):not([inert])',
    'select:not([disabled]):not([inert])',
    'textarea:not([disabled]):not([inert])',
    'button:not([disabled]):not([inert])',
    'iframe:not([tabindex^="-"]):not([inert])',
    'audio:not([tabindex^="-"]):not([inert])',
    'video:not([tabindex^="-"]):not([inert])',

giuseppeg

/**
 * Copyright (c) Nicolas Gallagher.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 *
 * @flow strict-local
 */

type Groups = { [key: number]: Array<string> };

giuseppeg

function MenuButton({ children }) {
  let called = false
  function getButtonProps(props) {
    const merged = merge({
      onClick: () => {},
      role: 'button',
    }, props)
    called = true
    return merged
  }

giuseppeg

https://jsperf.com/object-assign-vs-array-merging

giuseppeg

const span = getComputedStyle(document.querySelector('span'))
const button = getComputedStyle(document.querySelector('button'))

const diff = Object.keys(span).reduce((diff, p) => {
  if (span[p] != button[p]) {
    diff[p] = span[p]
  }
  return diff
}, {})

giuseppeg

static async getInitialProps ({ Component, router, ctx }) {
  let page = {}

  if (Component.getInitialProps) {
    page = await Component.getInitialProps(ctx)
  }

  const basepath = typeof window === 'undefined' 
    ? '' 
    : location.pathname.slice(0, location.pathname.length - router.route.length).replace(/\/$/, '')

giuseppeg

/* @flow */

import React from 'react'
import messages from '../messages'
import { injectIntl } from 'react-intl'
import type { IntlShape } from 'react-intl'

type Props = {|
  children: React.Node,
  intl: IntlShape,

giuseppeg

// given this

export const styles = {
  test: {
    color: 'red',
    display: props => props.visible ? 'block' : 'none'
  }
}

// rewrite to this

giuseppeg

function getCache(name) {
  return new Promise((resolve, reject) => {
    const version = 1;
    const request = indexedDB.open(name, version);

    request.onsuccess = event => {
      const db = event.target.result;

      /*
       * Returns a Promise that resolves with an object

giuseppeg

/*

1 and 2 are hashes of

`p[data-jsx~="?"] { color: ${props.color}; }`
and
`div[data-jsx~="?"] { border: 1px solid ${borderStyle} }`
*/
export default (props) => {
  const borderStyle = props.foo ? 'solid' : 'dashed'