Skip to content

Instantly share code, notes, and snippets.


October 25, 2022 to November 4, 2022

Generics around missingness

function Name<S extends string | undefined>(name: S): S {
  return name;

Making unique-id a importable function

The Use Cases

import { uniqueId } from "@ember/???";

  {{#let (unique-id) as |id|}}


A factory is a function that returns a new reactive object.

  • Reactive Factories return reactive objects.
  • Resource Factories also return reactive objects, but they also register cleanup functions that are called when the object is no longer needed.

You can use a class as a factory, but it's not required. When you use a class as a factory, its constructor must take zero required arguments.


I'm assuming these are all talking about cases that didn't already have semis:

Top-Level TemplateDeclaration

//         ^ 🚫
wycats / 1-unannotated.jsx
Created Sep 2, 2022
An explanation of how Starbeam integrates with React 18's reusable state (
View 1-unannotated.jsx
import { Cell } from "@starbeam/core";
import { useSetup } from "@starbeam/react";
const SYSTEM_LOCALE = Intl.DateTimeFormat().resolvedOptions().locale;
const SYSTEM_TZ = Intl.DateTimeFormat().resolvedOptions().timeZone;
function Clock({ locale = SYSTEM_LOCALE, timeZone = SYSTEM_TZ }) {
const now = useSetup((component) => {
const now = Cell(new Date()));
import Component from '@glimmer/component';
export default class extends Component {
wycats / 1-js.js
Created Jul 30, 2020
alternative observer design
View 1-js.js
// observed popover is interested in changes to `width` and `height` relative to the
// page's origin, and normalized by rounding them to the nearest integer.
let observedPopover = new RectObserver(
width: Math.round,
height: Math.round
relativeTo: 'origin' // not viewport
View controllers.application.js
import Ember from 'ember';
export default Ember.Controller.extend({
appName: 'Ember Twiddle',
value: 'Hello world',
inputted(e) {
Ember.set(this, 'value',;
View js.ts
// default tagName is 'div'
// The problem
function createElement(tagName: string): Element {
// very broken
return document.createElement(tagName || 'div');
// you might want to use defaults
import Ember from 'ember';
export default Ember.Component.extend({