mikaelbr

// === Arrays

var [a, b] = [1, 2];
console.log(a, b);
//=> 1 2


// Use from functions, only select from pattern
var foo = () => [1, 2, 3];

mmrko

// setup.js
import hook from 'css-modules-require-hook'
import sass from 'node-sass'

hook({
  extensions: [ '.scss' ],
  preprocessCss: data => sass.renderSync({ data }).css
})

kennetpostigo

First couple things I thought about when migrating after reading the docs

So migrating my existing app wasn't as troublesome as I originally thought. First thing I did was take a look at my router and routes and figure try to make a mental model of all the files where I had nested routes in the existing app because those components/containers will contain {this.props.children}. So I need to replace those with the nested <Match /> components.

So just to give an example:

In v2:

<Router history={history}>
  <Route path="/" component={App}>

developit

tracked

@tracked is a decorator for Preact that makes working with state values no different than properties on your component instance.

It's one 300 byte function that creates a getter/setter alias into state/setState() for a given key, with an optional initial value. The "magic" here is simply that it works as a property decorator rather than a function, so it appears to integrate directly into the language.

tracked has no dependencies and works with any component implementation that uses this.state and this.setState().

Installation

tkafka

The MIT License (MIT)

Copyright (c) 2014 Tomas Kafka

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

iammerrick

import React from 'react';

const toPromise = (load) => (new Promise((resolve) => (
  load(resolve)
)));

class LazilyLoad extends React.Component {

  constructor() {
    super(...arguments);

ryanflorence

import React, { Suspense, useState } from "react";
import { unstable_createResource as createResource } from "react-cache";
import {
  Autocomplete as Combobox,
  Input as ComboboxInput,
  List as ComboboxList,
  Option as ComboboxOption
} from "./Combobox";

function App({ tabIndex, navigate }) {

nmn

function component(fn){
  class C extends React.Component {
    render(){
      return fn(this.props, this.context)
    }
  }
  C.displayName = fn.displayName || fn.name
  C.propTypes = fn.propTypes
  C.contextTypes = fn.contextTypes
  return C