STRML

// @flow
import * as React from 'react';

type Dimensions = {width: number, height: number, ref: ?HTMLElement};
type Props = {
  children?: React.Node,
  className?: string,
  onResize: (dimensions: Dimensions) => any,
};

STRML

The problem:

When writing a React component, you want to target all environments. It is easy to generate a build that will work on the server and browser with Webpack, and as a bonus you can use loaders (like babel-loader for ES6 code).

When you generate this bundle, you should rely on "react" as an external so it isn't included in the bundle. In all environments this is desired behavior so you don't duplicate "react" and break it. This is necessary both because it would make a much larger bundle than necessary, but also because React behaves badly when multiple copies are loaded.

If you do this, you'll end up with a UMD shim like:

(function webpackUniversalModuleDefinition(root, factory) {

STRML

blueprint:
  name: ZHA - Lutron Aurora Dimmer Expanded v1.5
  description: Control lights with a Lutron Aurora Dimmer Pressing in the dimmer button will toggle between turning lights on to full brightness, and turning the lights off. Rotating the dimmer will increase and decrease the light brightness. Adjust the sensitivity if updates from the dimmer are being sent too quickly.
  domain: automation
  input:
    remote:
      name: Lutron Aurora Dimmer Switch
      description: Lutron Aurora Z3-1BRL
      selector:
        device:

STRML

async function ensureCarouselVisible() {
  const imgWrap = document.elementFromPoint(100, 100);
  if (!imgWrap.classList.contains('pswp__item')) {
    // carousel isn't active, make it so
    document.querySelector('.gallery img').click();
    while (!document.elementFromPoint(100, 100).classList.contains('pswp__item')) {
      await delay(50);
    }
  }
}